/* The Help tab.
 *
 * **IT IS A DOCUMENT, SO IT IS SET LIKE ONE.** Measured line length, room
 * between the parts, and a clear break between one tab's entry and the next --
 * a wall of even text is a wall nobody reads to the bottom of.
 */

.k-help-doc {
  display: block;
  min-width: 0;
  margin: 16px 0 0;
}

.k-help-doc__section {
  margin: 32px 0 12px;
  font-size: 1.05rem;
  color: var(--text);
}

/* One tab's entry. Boxed, so where one ends and the next begins is never in
 * doubt on a long page. */
.k-help-doc__entry {
  margin: 0 0 16px;
  padding: 16px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
}

.k-help-doc__tab {
  margin: 0 0 6px;
  font-size: 1rem;
  color: var(--text);
}

/* **THE ONE LINE SOMEBODY SKIMS.** Set apart from the steps below it so the eye
 * lands here first -- which is the whole reason it exists. Held to a readable
 * measure, because a sentence running the full width of a desktop is one the
 * eye loses its place in. */
.k-help-doc__crux {
  margin: 0 0 12px;
  max-width: 68ch;
  color: var(--text);
}

.k-help-doc__steps {
  margin: 0;
  padding-left: 20px;
  max-width: 68ch;
}

.k-help-doc__step {
  margin: 0 0 6px;
  color: var(--text-muted);
  line-height: 1.55;
}

/* **THE "WHY", FOLDED AWAY.** Left open it would push the next tab's steps off
 * the screen for somebody who only wanted the steps. */
.k-help-doc__more {
  margin: 14px 0 0;
  padding: 10px 0 0;
  border-top: 1px solid var(--border);
}

/* **BIG ENOUGH TO PRESS (D67, cycle 46 R5#9).** This is a summary line the
 * seller taps to open the reasoning under a manual entry. At 0.9rem with no
 * padding it stood about 17px tall -- readable, and on a phone barely
 * hittable. The row is the target, so the size goes on the row. */
.k-help-doc__more-mark {
  display: flex;
  align-items: center;
  min-height: 44px;
  cursor: pointer;
  color: var(--text-muted);
  font-size: 0.9rem;
}

.k-help-doc__more-mark:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

.k-help-doc__more-line {
  margin: 10px 0 0;
  max-width: 68ch;
  color: var(--text-muted);
  font-size: 0.9rem;
  line-height: 1.55;
}