/* teachPress template: Cards
   Inherits the theme's fonts and text colour. Override the tokens below
   (Appearance > Customize > Additional CSS) to match your site. */

.tp-cards {
  --tpc-accent: #2a5d8f;          /* year rule, press marker, hover */
  --tpc-free:  #2f7d4f;           /* preprint / archived-copy buttons */
  --tpc-repo:  #2a5d8f;           /* repository (Zenodo) buttons */
  --tpc-press: #b3362b;           /* press button and strip */
  --tpc-line: rgba(128, 128, 128, 0.32);
  --tpc-panel: rgba(128, 128, 128, 0.10);
  --tpc-muted: rgba(128, 128, 128, 0.95);
  --tpc-radius: 6px;
  --tpc-gap: 1.25rem;
  --tpc-number-w: 3rem;           /* width of the number column */
  --tpc-thumb-w: 11rem;           /* width of the thumbnail column */
  --tpc-card-min-h: 8rem;         /* keeps short cards from squashing the thumbnail */
  --tpc-top: 1rem;                /* top padding shared by number, type label and title */
  --tpc-pad-x: 1.1rem;            /* horizontal text inset inside the card */
  --tpc-title-size: 1.1rem;       /* shared by number, type label and title */
  font-size: 1rem;
  line-height: 1.45;
}

/* ---------- Year rail ---------- */

.tp-cards__year {
  display: flex;
  align-items: baseline;
  gap: 0.75rem;
  margin: 2.5rem 0 1rem;
  font-size: 2rem;
  font-weight: 500;
  letter-spacing: -0.01em;
  line-height: 1;
}
.tp-cards__year::after {
  /* A real (non-breaking) space gives the rule a true text baseline, so it
     sits exactly on the year's baseline in every browser and theme. The tiny
     font-size and zero line-height collapse the box to that baseline. */
  content: "\00a0";
  flex: 1 1 auto;
  font-size: 1px;
  line-height: 0;
  border-bottom: 2px solid var(--tpc-accent);
  opacity: 0.55;
}
.tp-cards__year:first-of-type { margin-top: 0.5rem; }

.tp-cards__type {
  grid-column: 1 / -1;
  margin: 0.5rem 0 -0.25rem;
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--tpc-muted);
}

/* ---------- List ---------- */

.tp-cards__grid {
  display: flex;
  flex-direction: column;
  gap: var(--tpc-gap);
  margin: 0;
}
.tp-cards__grid:empty { display: none; }

/* ---------- Card: number | thumbnail | text ---------- */

.tp-card {
  display: grid;
  grid-template-columns: var(--tpc-number-w) var(--tpc-thumb-w) minmax(0, 1fr);
  min-height: var(--tpc-card-min-h);
  align-items: start;
  border: 1px solid var(--tpc-line);
  border-radius: var(--tpc-radius);
  overflow: hidden;
  background: transparent;
}
.tp-card:focus-within { border-color: var(--tpc-accent); }

.tp-card__number {
  align-self: stretch;
  display: flex;
  justify-content: center;
  padding: var(--tpc-top) 0.25rem 0;
  font-size: var(--tpc-title-size);
  font-weight: 600;
  line-height: 1.3;
  font-variant-numeric: tabular-nums;
  color: var(--tpc-muted);
  border-right: 1px solid var(--tpc-line);
}

.tp-card__figure {
  /* Image shown at full column width (never cropped), type label beneath it */
  display: flex;
  flex-direction: column;
  margin: 0;
  padding: 0 var(--tpc-pad-x) 0.75rem;   /* same inset as the text column */
  align-self: stretch;
  min-width: 0;
  background: transparent;
  overflow: hidden;
}
.tp-card__img { flex: none; }
.tp-card__img img,
.tp-card__img a img {
  display: block;
  width: 100%;
  height: auto;
  max-width: 100%;
}
.tp-card__img a { display: block; }
.tp-card__kind {
  order: -1;                      /* type label first, on the title's line */
  padding: var(--tpc-top) 0 0.6rem;
  color: var(--tpc-muted);
  font-size: var(--tpc-title-size);
  font-weight: 600;
  line-height: 1.3;
}

.tp-card__body {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  padding: var(--tpc-top) var(--tpc-pad-x) 1.1rem;
  flex: 1 1 auto;
}
.tp-card__body p { margin: 0; }

.tp-card__title {
  margin: 0;
  font-size: var(--tpc-title-size);
  font-weight: 600;
  line-height: 1.3;
}
.tp-card__title a { text-decoration: none; }
.tp-card__title a:hover { text-decoration: underline; }

.tp-card__authors { font-size: 0.95rem; }
.tp-card__person { text-decoration: none; border-bottom: 1px solid var(--tpc-line); }
.tp-card__person:hover { border-bottom-color: currentColor; }

.tp-card__meta {
  font-size: 0.9rem;
  color: var(--tpc-muted);
}
.tp-card__meta .tp_pub_additional_journal,
.tp-card__meta .tp_pub_additional_booktitle { font-style: italic; }

.tp-card__people {
  font-size: 0.9rem;
}
.tp-card__people-label { color: var(--tpc-muted); }

/* Contribution markers and their legend */
.tp-card__mark {
  font-size: 0.7em;
  line-height: 0;
  margin-left: 0.05em;
  color: var(--tpc-accent);
}
.tp-card__legend {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem 1rem;
  font-size: 0.78rem;
  color: var(--tpc-muted);
}

/* Open access badge (colour by route; override per site if you like) */
.tp-card__oa {
  display: inline-flex;
  align-items: center;
  gap: 0.25em;
  vertical-align: middle;
  margin-left: 0.3rem;
  padding: 0.1rem 0.45rem 0.1rem 0.35rem;
  border-radius: 3px;
  font-size: 0.7rem;
  font-weight: 600;
  line-height: 1.4;
  color: #fff;
  background: #b8781a;            /* gold / open */
}
.tp-card__oa--green   { background: #2f7d4f; }
.tp-card__oa--hybrid  { background: #7a5a1e; }
.tp-card__oa--diamond { background: #3b6ea5; }
.tp-card__oa--bronze  { background: #8a5a3c; }
.tp-card__oa--closed  { background: var(--tpc-panel); color: var(--tpc-muted); }
.tp-card__lock { width: 0.8em; height: 1em; flex: none; }

/* Clickable open-access badge */
a.tp-card__oa { text-decoration: none; }
a.tp-card__oa:hover,
a.tp-card__oa:focus-visible { filter: brightness(1.12); outline: none; }

/* Coloured buttons: free copies green, repository blue, press red */
.tp-card__menu .tp-card__free,
.tp-card__menu .tp-card__zenodo,
.tp-card__menu .tp-card__press-toggle {
  border-color: currentColor;
  font-weight: 600;
}
.tp-card__menu .tp-card__free         { color: var(--tpc-free); }
.tp-card__menu .tp-card__zenodo       { color: var(--tpc-repo); }
.tp-card__menu .tp-card__press-toggle { color: var(--tpc-press); }
.tp-card__menu .tp-card__free:hover,
.tp-card__menu .tp-card__free:focus-visible   { background: var(--tpc-free);  color: #fff; }
.tp-card__menu .tp-card__zenodo:hover,
.tp-card__menu .tp-card__zenodo:focus-visible { background: var(--tpc-repo);  color: #fff; }
.tp-card__menu .tp-card__press-toggle:hover,
.tp-card__menu .tp-card__press-toggle:focus-visible { background: var(--tpc-press); color: #fff; }

/* Preprints: dashed frame and a badge in the title */
.tp-card--preprint { border-style: dashed; }
.tp-card__badge { background: transparent; border: 1px dashed var(--tpc-line); }
.tp-card__version {
  font-size: 0.88rem;
}
.tp-card__version a { text-decoration: none; border-bottom: 1px solid var(--tpc-line); }
.tp-card__version a:hover { border-bottom-color: currentColor; }
.tp-card__version--published { font-weight: 600; }

/* Press coverage: a marked strip, revealed by the Press button */
.tp-card__press[hidden] { display: none; }
.tp-card__press {
  margin-top: 0.5rem;
  padding: 0.5rem 0 0.5rem 0.85rem;
  border-left: 3px solid var(--tpc-press);
  font-size: 0.88rem;
}
.tp-card__press-label {
  display: block;
  margin-bottom: 0.2rem;
  color: var(--tpc-muted);
}
.tp-card__press ul { list-style: none; margin: 0; padding: 0; }
.tp-card__press li { margin: 0 0 0.15rem; }
.tp-card__press a { text-decoration: none; }
.tp-card__press a:hover .tp-card__outlet { text-decoration: underline; }
.tp-card__outlet { font-weight: 600; }
.tp-card__headline { color: var(--tpc-muted); }
.tp-card__headline::before { content: "— "; }

/* Buttons (teachPress' own markup) */
.tp-card__menu {
  margin-top: auto !important;   /* push to the bottom of the card */
  padding-top: 0.6rem;
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  font-size: 0.82rem;
}
.tp-card__menu a,
.tp-card__menu button,
.tp-card__menu .tp_pub_tags a {
  display: inline-block;
  padding: 0.2rem 0.55rem;
  border: 1px solid var(--tpc-line);
  border-radius: 999px;
  text-decoration: none;
  line-height: 1.4;
}
.tp-card__menu a:hover,
.tp-card__menu a:focus-visible,
.tp-card__menu button:hover,
.tp-card__menu button:focus-visible {
  border-color: var(--tpc-accent);
  outline: none;
}
.tp-card__menu button {
  font: inherit;
  font-size: inherit;
  background: transparent;
  color: inherit;
  cursor: pointer;
  margin: 0;
}
.tp-card__press-toggle[aria-expanded="true"] {
  background: var(--tpc-press);
  color: #fff;
}
.tp-card__menu .tp_pub_tags_label,
.tp-card__menu .tp_pub_links_label { display: none; }

/* Keywords: quieter chips on their own row, below the buttons */
.tp-card__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.3rem;
  font-size: 0.78rem;
}
.tp-card__tags a,
.tp-card__tags span {
  display: inline-block;
  padding: 0.15rem 0.5rem;
  border-radius: 4px;
  background: var(--tpc-panel);
  color: var(--tpc-muted);
  text-decoration: none;
  line-height: 1.4;
}
.tp-card__tags a:hover,
.tp-card__tags a:focus-visible {
  color: inherit;
  outline: none;
}

/* Labels teachPress adds to the title (type / status / award) */
.tp-card .tp_pub_label_status,
.tp-card .tp_pub_label_award {
  display: inline-block;
  vertical-align: middle;
  margin-left: 0.3rem;
  padding: 0.1rem 0.4rem;
  border-radius: 3px;
  font-size: 0.7rem;
  font-weight: 600;
  background: var(--tpc-panel);
}

/* Expandable containers (abstract, BibTeX, links) */
.tp-card .tp_abstract,
.tp-card .tp_bibtex,
.tp-card .tp_links,
.tp-card .tp_altmetric {
  margin-top: 0.5rem;
  padding: 0.6rem 0.75rem;
  border-radius: 4px;
  background: var(--tpc-panel);
  font-size: 0.85rem;
}
.tp-card pre,
.tp-card .tp_bibtex pre { white-space: pre-wrap; overflow-x: auto; font-size: 0.8rem; }

/* ---------- Small screens: thumbnail moves above the text ---------- */

@media (max-width: 640px) {
  .tp-cards__year { font-size: 1.6rem; }
  .tp-card {
    grid-template-columns: var(--tpc-number-w) minmax(0, 1fr);
    grid-template-rows: auto auto;
  }
  .tp-card__number { grid-row: 1 / span 2; }
  .tp-cards { --tpc-pad-x: 0.95rem; }
  /* cover, type label and text share one left edge */
  .tp-card__figure { grid-column: 2; padding: 0 var(--tpc-pad-x) 0.5rem; }
  .tp-card__img { max-width: 12rem; }
  .tp-card__kind { padding-bottom: 0.4rem; }
  .tp-card__body { grid-column: 2; padding: 0.4rem var(--tpc-pad-x) 1rem; }
}
