/*
 * The public (anonymous) software list — `templates/software/public_list.html`.
 *
 * See design_handoff_ilifu_software_catalog/README.md, "Public list
 * (anonymous)", for every value below; this file adds nothing the handoff
 * doesn't call for. All colour, spacing and radius values reuse the shared
 * tokens in tokens.css/base.css — nothing here is a hardcoded hex value.
 *
 * NOTE: a handful of pixel values below (34px/60px page padding, 15px/17px
 * request-box padding, the 14px intro copy size) are exact values taken
 * from the hi-fi design's own markup but are not present in base.css's
 * documented spacing/type scale (which lists 2,4,6,7,9,11,13,14,16,18,
 * 22,26,30 for spacing and 9.5,10,10.5,11,11.5,12,12.5,13,15,22,24 for type
 * — the handoff README's own listed scales, not this project's invention,
 * simply omit them). base.css already carries one precedent for this
 * exact situation (`--space-8`, documented there); those are reusable
 * across screens, so they became tokens. The values below are used in
 * exactly one place each, so they stay literal here rather than growing
 * the shared scale for a single call site.
 */

.public-list {
  max-width: 1060px;
  margin: 0 auto;
  /* 34px/60px: see the file-level NOTE above. */
  padding: 34px var(--space-22) 60px;
  display: flex;
  flex-direction: column;
  gap: var(--space-26);
}

.public-list__intro {
  display: flex;
  flex-direction: column;
  gap: var(--space-11);
  max-width: 660px;
}

.public-list__title {
  margin: 0;
  font-size: var(--fs-24);
  font-weight: 700;
  letter-spacing: var(--tracking-title);
}

.public-list__intro-copy {
  margin: 0;
  /* 14px: see the file-level NOTE above. */
  font-size: 14px;
  line-height: 1.65;
  color: var(--fg2);
  text-wrap: pretty;
}

.public-list__groups {
  display: flex;
  flex-direction: column;
  gap: var(--space-22);
}

.public-list__group {
  display: flex;
  flex-direction: column;
  gap: var(--space-9);
}

.public-list__group-heading {
  display: flex;
  align-items: baseline;
  gap: var(--space-9);
  border-bottom: var(--border-width) solid var(--line);
  padding-bottom: var(--space-6);
}

.public-list__group-name {
  font-size: var(--fs-13);
  font-weight: 500;
  letter-spacing: 0.02em;
}

.public-list__group-count {
  font-size: var(--fs-10-5);
  color: var(--dim);
}

.public-list__chips {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-7);
}

.public-list__chip {
  border: var(--border-width) solid var(--line2);
  border-radius: var(--radius-sm);
  padding: var(--space-4) var(--space-9);
  font-size: var(--fs-11-5);
  color: var(--fg2);
}

.public-list__request {
  border: var(--border-width) dashed var(--line2);
  border-radius: var(--radius-md);
  /* 15px/17px: see the file-level NOTE above. */
  padding: 15px 17px;
  display: flex;
  align-items: center;
  gap: var(--space-14);
}

.public-list__request-copy {
  margin: 0;
  font-size: var(--fs-12-5);
  line-height: 1.6;
  color: var(--fg2);
  max-width: 600px;
}

.public-list__request-cta {
  margin-left: auto;
  flex: none;
  /* Overrides .btn's default 8px vertical padding: the handoff's own
     markup gives this specific button 9px, one pixel more than the header
     action button that otherwise shares .btn--outline-accent. */
  padding: var(--space-9) var(--space-13);
}

.public-list__footer {
  margin: 0;
  font-size: var(--fs-10-5);
  color: var(--dim);
}