/* ==========================================================================
   Slate — left-aligned sans masthead, accent job title, quiet grey-blue ink.
   Modelled on the classic single-column builder resume: bold name, blue
   label line, dot-separated contact row, uppercase section labels, and
   "Role, Company" entry heads with right-aligned muted dates.
   ========================================================================== */

.theme-slate {
  --ink-heading: #111827;
  --ink-body: #374151;
  --ink-secondary: #4b5563;
  --ink-muted: #64748b;
  --ink-hairline: #d3d9e0;
  --ink-footer: #8a94a3;
}

/* --- Masthead ------------------------------------------------------------ */
.theme-slate .doc-masthead {
  text-align: left;
  padding-bottom: 1.2em;
  border-bottom: 0.5pt solid var(--rule-color);
  margin-bottom: 1.3em;
}

.theme-slate .doc-name {
  font-size: 2.2em;
  font-weight: 700;
  letter-spacing: -0.01em;
  line-height: 1.1;
}

.theme-slate .doc-contact {
  margin-top: 0.45em;
  font-size: 0.9em;
  color: var(--ink-muted);
}

/* The label (job title) breaks onto its own accent-coloured line; the rest of
   the contact row runs below it, separated by bullets. */
.theme-slate .doc-contact-item:has(.doc-contact-label) {
  display: block;
  color: var(--doc-accent);
  font-weight: 500;
  font-size: 1.1em;
  margin-bottom: 0.4em;
}
.theme-slate .doc-contact-item + .doc-contact-item::before {
  content: '•';
  margin: 0 0.5em;
  color: var(--ink-muted);
}
.theme-slate .doc-contact-item:has(.doc-contact-label) + .doc-contact-item::before {
  content: none;
}

/* --- Sections ------------------------------------------------------------ */
.theme-slate .doc-section {
  margin-bottom: 1.2em;
}

.theme-slate .doc-section-title {
  font-size: 0.88em;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  margin-bottom: 0.55em;
}

/* --- Timeline entries ---------------------------------------------------- */
.theme-slate .doc-entry {
  margin-bottom: 0.85em;
}
.theme-slate .doc-entry:last-child {
  margin-bottom: 0;
}

.theme-slate .doc-entry-head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 1em;
}

/* The builder look puts the role first: "Senior Engineer, Acme". The DOM
   stays company-then-role (heading, subheading) for parsers; row-reverse
   only swaps the visual order. */
.theme-slate .doc-entry-titles {
  display: flex;
  flex-direction: row-reverse;
  justify-content: flex-end;
  align-items: baseline;
  gap: 0.3em;
}
.theme-slate .doc-entry-heading {
  font-weight: 600;
}
.theme-slate .doc-entry-subheading {
  font-weight: 600;
  font-size: 1em;
  color: var(--ink-heading);
}
.theme-slate .doc-entry-subheading::after {
  content: ',';
}

.theme-slate .doc-entry-dates {
  font-size: 0.85em;
}

/* --- Bullets ------------------------------------------------------------- */
.theme-slate .doc-bullets {
  margin-top: 0.4em;
}
.theme-slate .doc-bullets li {
  margin-bottom: 0.3em;
}
.theme-slate .doc-bullets li::before {
  background: var(--ink-muted);
}

/* --- List entries (Skills) — bulleted "Label: a, b, c" lines ------------- */
/* Opt out of base's shared two-column grid: entries here are inline lines. */
.theme-slate .doc-layout-list .doc-entries {
  display: block;
}
.theme-slate .doc-entry-list {
  display: block;
  position: relative;
  padding-left: 1.1em;
  margin-bottom: 0.3em;
}
.theme-slate .doc-entry-list::before {
  content: '';
  position: absolute;
  left: 0.15em;
  top: calc(0.5em * var(--doc-line-height) - 1.5px);
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: var(--ink-muted);
}
.theme-slate .doc-list-heading::after {
  content: ':';
  margin-right: 0.35em;
}
