/* The public topic page, /topics/:id — vanilla CSS (project preference). */

.topic-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  flex-wrap: wrap;
  margin: 1.5rem 1rem 0.5rem;
}

/* Names are stored as index headings ("God, nature of"), so they are shown in
   capitals, as the topics index and the home page show them. */

.topic-header__name {
  font-size: 1.5rem;
  font-weight: 800;
  line-height: 1.2;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: #1e3a8a; /* the site's heading blue */
}

/* Editors only: a way into the topic's editor page. */

.topic-header__edit {
  display: inline-flex;
  align-items: center;
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding: 0.45rem 0.85rem;
  border-radius: 0.25rem;
  border: 1px solid #d6d3d1; /* stone-300 */
  background: #fff;
  color: #44403c; /* stone-700 */
  white-space: nowrap;
}

.topic-header__edit:hover {
  background: #f5f5f4; /* stone-100 */
}