/* Publications page: the full record. It adds a page head, a filter, an
   abstract and BibTeX to the rail of publications.css. */


/* Toolbar ------------------------------------------------------------- */

/* One bar with two ends: the count on the left, the export on the right. A
   bar too narrow for both puts the export on its own line. */
.pub-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.9rem 1.5rem;
  margin-bottom: 2.6rem;
}

/* Without a script the filter does nothing, so CSS hides it. The export
   stays, because the file link needs no script. */
.filter-group { display: none; }

.js .filter-group {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.45rem 1.1rem;
}

.filter-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
}

.chip {
  font-family: var(--font-mono);
  font-size: 0.7rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--muted);
  border: 1px solid var(--line);
  background: transparent;
  border-radius: 999px;
  padding: 0.42rem 0.95rem;
  cursor: pointer;
  transition: color 140ms ease, border-color 140ms ease, background 140ms ease;
}

.chip[aria-pressed="true"] {
  color: var(--paper);
  background: var(--ink);
  border-color: var(--ink);
}

.pub-count {
  font-family: var(--font-mono);
  font-size: 0.72rem;
  letter-spacing: 0.06em;
  color: var(--muted);
}

/* Entries ------------------------------------------------------------- */

/* display:grid cancels the hidden attribute. This rule makes the attribute
   effective again. */
.pub[hidden] { display: none; }

/* The filter changes which entry is first and last. The caps of the rail
   therefore come from classes, and not from the position of the child. */
.pub:first-child .pub-node::before { top: 0; }
.pub:last-child .pub-node::before { bottom: 0; height: auto; }
.pub:last-child .pub-body { padding-bottom: 3.2rem; }

.pub.rail-start .pub-node::before { top: 1.25rem; }
.pub.rail-end .pub-node::before { bottom: auto; height: 1.25rem; }
.pub.rail-end .pub-body { padding-bottom: 0; }

/* The wide BibTeX block makes the 1fr track too wide without min-width. */
.pubs-page .pub-body {
  min-width: 0;
  padding-bottom: 3.2rem;
}

.pubs-page .pub-title { font-size: 1.16rem; }

.pub-abstract {
  margin-top: 0.85rem;
  max-width: var(--w-prose);
}

.pub-abstract p {
  font-size: 0.97rem;
  line-height: 1.68;
  color: var(--muted);
}

/* Limit the abstract only if the page has the toggle button. */
.js .pub-abstract.is-clamped p {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.abstract-toggle {
  display: none;
  margin-top: 0.5rem;
  font-family: var(--font-mono);
  font-size: 0.7rem;
  letter-spacing: 0.06em;
  color: var(--accent-strong);
  background: none;
  border: 0;
  border-bottom: 1px solid transparent;
  padding: 0 0 1px;
  cursor: pointer;
  transition: border-color 140ms ease;
}

.js .abstract-toggle { display: inline-block; }

.abstract-toggle[hidden] { display: none; }

.abstract-toggle:hover, .abstract-toggle:focus-visible {
  border-bottom-color: color-mix(in srgb, var(--accent) 45%, transparent);
}

.pub-actions {
  margin-top: 1rem;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.4rem 1.25rem;
  font-family: var(--font-mono);
  font-size: 0.72rem;
  letter-spacing: 0.06em;
}

.pub-actions a {
  color: var(--accent-strong);
  text-decoration: none;
  border-bottom: 1px solid transparent;
  padding-bottom: 1px;
  transition: border-color 140ms ease;
}

.pub-actions a:hover, .pub-actions a:focus-visible {
  border-bottom-color: color-mix(in srgb, var(--accent) 45%, transparent);
}

.pub-doi { color: var(--muted); overflow-wrap: anywhere; }

/* The record has its own row here, so an open record does not move the
   links near it. */
.pub-actions .cite {
  flex: 1 1 100%;
  min-width: 0;
  margin-top: 0.15rem;
}

@media (max-width: 720px) {
  .pub-toolbar { margin-bottom: 2rem; gap: 0.7rem; }
  .pub-count { width: 100%; }

  .pubs-page .pub-body { padding-bottom: 2.6rem; }
  .pubs-page .pub-title { font-size: 1.06rem; }
  .pub-abstract p { font-size: 0.94rem; }
}

/* The export end: one click for every record, and the .bib file.

   A chip on the other end holds a state. A button here starts an action, so
   it takes the accent colour and a mark of what it does. */
.pub-export {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.45rem;
}

.export-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  font-family: var(--font-mono);
  font-size: 0.7rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-decoration: none;
  color: var(--accent-strong);
  background: color-mix(in srgb, var(--accent) 7%, transparent);
  border: 1px solid color-mix(in srgb, var(--accent) 35%, var(--line-strong));
  border-radius: 999px;
  padding: 0.42rem 0.95rem;
  cursor: pointer;
  transition: border-color 140ms ease, background 140ms ease;
}

.export-btn:hover, .export-btn:focus-visible {
  border-color: var(--accent);
  background: color-mix(in srgb, var(--accent) 13%, transparent);
}

.export-icon {
  width: 0.85rem;
  height: 0.85rem;
  flex-shrink: 0;
}

/* The copy button needs a script. These rules must be more specific than
   the rule that shows a button. */
.export-btn.needs-js { display: none; }
.js .export-btn.needs-js { display: inline-flex; }