/* ============================================================================
   ADVOKE CV — templates/family-timeline.css
   Layout family: timeline
   Thin vertical rail down the left of the experience, education, volunteer
   and projects sections. Nodes mark each entry. Used by Structured
   Chronological, Modern Achievement and Project Manager.
   ============================================================================ */

.resume--timeline > .layout--timeline {
  display: block;
}

.layout--timeline .resume-body--timeline {
  position: relative;
  padding-left: var(--t-timeline-indent);
}

/* The rail itself. */
.layout--timeline .resume-body--timeline::before {
  content: "";
  position: absolute;
  left: calc(var(--t-timeline-indent) - var(--t-timeline-rail-width) - 3px);
  top: 4px;
  bottom: 4px;
  width: var(--t-timeline-rail-width);
  background: var(--t-timeline-rail);
  border-radius: var(--t-timeline-rail-width);
}

/* Each timed block gets a node on the rail. */
.layout--timeline .resume-timeline__block {
  position: relative;
}

.layout--timeline .resume-timeline__block + .resume-timeline__block {
  margin-top: var(--t-section-gap);
}

.layout--timeline .resume-timeline__block--timed .resume-entry {
  position: relative;
}

.layout--timeline .resume-timeline__block--timed .resume-entry::before {
  content: "";
  position: absolute;
  left: calc(var(--t-timeline-indent) * -1 + 4px);
  top: 0.6em;
  width: var(--t-timeline-node-size);
  height: var(--t-timeline-node-size);
  background: var(--t-timeline-node);
  border-radius: 50%;
  box-shadow: 0 0 0 2px var(--t-paper);
}

.layout--timeline .resume-timeline__block--timed .resume-entry + .resume-entry {
  margin-top: calc(var(--t-block-gap) + 4px);
}

/* Plain blocks do not receive nodes but keep the same indent. */
.layout--timeline .resume-timeline__block--plain .resume-section__heading {
  padding-left: 0;
}

/* Narrow screens and print: keep the rail but reduce the indent. */
@media print {
  .layout--timeline .resume-body--timeline {
    padding-left: 6mm;
  }
  .layout--timeline .resume-body--timeline::before {
    left: 2mm;
  }
  .layout--timeline .resume-timeline__block--timed .resume-entry::before {
    left: -4mm;
  }
}