/*
 * CV engine: one stylesheet for the on-screen canvas AND the PDF.
 * Every page is a fixed A4 box (210mm x 297mm). Nothing here may depend on
 * the surrounding app (theme, viewport) so canvas == print.
 */
@page { size: A4; margin: 0; }

.cv-doc, .cv-doc * { box-sizing: border-box; }
.cv-doc {
  --cv-ink: #1a1a1a;
  --cv-ink-2: #333333;
  --cv-ink-3: #555555;
  --cv-sep: #888888;
  --cv-rule: #bdbdbd;
  --cv-accent: #1a1a1a;
  --cv-scale: 1;
  --cv-font: "IBM Plex Sans Arabic", "Noto Sans Arabic", "Tajawal", sans-serif;
  --cv-pad-top: 10.6mm;
  --cv-pad-x: 17.1mm;
  --cv-pad-bottom: 5mm;
  --cv-gap-section: 8.5pt;
  --cv-gap-entry: 3.1pt;
  -webkit-print-color-adjust: exact;
  print-color-adjust: exact;
  text-rendering: geometricPrecision;
  font-kerning: normal;
}

.cv-page {
  position: relative;
  width: 210mm;
  height: 297mm;
  overflow: hidden;
  background: #fff;
  color: var(--cv-ink);
  font-family: var(--cv-font);
  font-size: calc(10pt * var(--cv-scale));
  line-height: 1.6;
  padding: var(--cv-pad-top) var(--cv-pad-x) var(--cv-pad-bottom);
  break-after: page;
  page-break-after: always;
}
.cv-page:last-child { break-after: auto; page-break-after: auto; }
.cv-content { display: flex; flex-direction: column; }

/* Blocks never use vertical margins (no collapsing): spacing is padding, so the
   paginator can sum measured heights exactly. */
.cv-block { padding: 0; margin: 0; }

/* ---------- header ---------- */
.cv-name {
  font-size: calc(24pt * var(--cv-scale));
  font-weight: 800;
  line-height: 1.3;
  color: var(--cv-ink);
  margin: 0;
  letter-spacing: 0;
}
.cv-headline { font-size: calc(11pt * var(--cv-scale)); color: var(--cv-ink-3); font-weight: 500; margin: 1pt 0 0; line-height: 1.4; }
.cv-contact {
  font-size: calc(9.3pt * var(--cv-scale));
  color: var(--cv-ink-2);
  line-height: 1.5;
  margin-top: 11.5pt;
  display: flex; flex-wrap: wrap; align-items: baseline;
}
.cv-contact .cv-c { white-space: nowrap; unicode-bidi: isolate; }
.cv-contact .cv-dot { color: var(--cv-sep); padding: 0 .45em; }
.cv-header { padding-bottom: 12.6pt; border-bottom: .75pt solid var(--cv-ink); }
.cv-photo { width: 26mm; height: 26mm; border-radius: 50%; object-fit: cover; flex: none; }
.cv-header.has-photo { display: flex; gap: 14pt; align-items: center; }

/* ---------- section titles ---------- */
.cv-title {
  padding-top: var(--cv-gap-section);
}
.cv-title h2 {
  font-size: calc(12.5pt * var(--cv-scale));
  font-weight: 700;
  color: var(--cv-accent);
  line-height: 1.4;
  margin: 0;
  padding-bottom: 3.5pt;
  border-bottom: .75pt solid var(--cv-rule);
}
.cv-block.first-in-section { padding-top: 5.5pt; }

/* ---------- text ---------- */
.cv-para { text-align: justify; text-justify: inter-word; line-height: 1.7; margin: 0; }
.cv-para + .cv-para { margin-top: 4pt; }

/* ---------- entries (experience / education / projects …) ---------- */
.cv-entry { padding-top: var(--cv-gap-entry); font-size: calc(10.5pt * var(--cv-scale)); line-height: 1.43; }
.cv-entry.first-in-section { padding-top: 5.5pt; }
.cv-entry-row { display: flex; justify-content: space-between; align-items: baseline; gap: 12pt; }
.cv-org { color: var(--cv-ink); font-weight: 400; min-width: 0; }
.cv-date { color: var(--cv-ink-3); font-weight: 600; white-space: nowrap; unicode-bidi: isolate; flex: none; }
.cv-role { font-weight: 700; color: var(--cv-ink); }
.cv-meta { color: var(--cv-ink-3); font-size: .93em; }

/* ---------- bullets ---------- */
.cv-li {
  display: flex;
  align-items: flex-start;
  font-size: calc(10pt * var(--cv-scale));
  line-height: 1.6;
}
.cv-li::before {
  content: "";
  flex: none;
  width: 3pt; height: 3pt; border-radius: 50%;
  margin-top: calc(.8em - 1.5pt);
  margin-inline: 3pt 8.4pt;
  background: var(--cv-ink);
}
.cv-li.after-entry { padding-top: 4.5pt; }

/* ---------- skills ---------- */
.cv-subhead { font-size: calc(10.5pt * var(--cv-scale)); font-weight: 700; line-height: 1.43; padding-top: 5pt; }
.cv-grid { display: grid; grid-template-columns: repeat(var(--cols, 3), minmax(0, 1fr)); column-gap: 8pt; }
.cv-subhead + .cv-grid { padding-top: 2pt; }
.cv-grid .cv-li { padding-top: 0; }
.cv-pairs { display: grid; grid-template-columns: repeat(var(--cols, 2), minmax(0, 1fr)); column-gap: 16pt; padding-top: 6.5pt; }
.cv-inline { display: flex; flex-wrap: wrap; column-gap: 14pt; padding-top: 1pt; }
.cv-inline .cv-li { padding-top: 0; }
.cv-level { color: var(--cv-ink-3); }

/* ---------- links: printable, never blue ---------- */
.cv-doc a { color: inherit; text-decoration: none; }

/* ---------- LTR (English CV) ---------- */
.cv-doc[dir="ltr"] { --cv-font: "IBM Plex Sans", "Noto Sans", "Helvetica Neue", Arial, sans-serif; }
.cv-doc[dir="ltr"] .cv-para { text-align: left; }

/* ======================================================================
 * Template variants. Each only overrides tokens + a few rules so every
 * template stays single-flow, ATS-safe, real text.
 * ==================================================================== */

/* Classic: the reference. Monochrome, rules, justified summary. */
.cv-doc.t-classic { }

/* Accent: same skeleton, colour carried by the name, titles and rules. */
.cv-doc.t-accent .cv-name { color: var(--cv-accent); }
.cv-doc.t-accent .cv-title h2 { border-bottom-color: color-mix(in srgb, var(--cv-accent) 45%, #fff); }
.cv-doc.t-accent .cv-header { border-bottom: 2pt solid var(--cv-accent); }
.cv-doc.t-accent .cv-li::before { background: var(--cv-accent); }

/* Compact: denser rhythm for students with a lot to fit on one page. */
.cv-doc.t-compact { --cv-gap-section: 9pt; --cv-gap-entry: 3.5pt; --cv-pad-top: 10mm; --cv-pad-bottom: 9mm; --cv-pad-x: 14mm; }
.cv-doc.t-compact .cv-para { line-height: 1.55; }
.cv-doc.t-compact .cv-li { line-height: 1.5; }

/* Centered: centred header, titles with a short rule; still single column. */
.cv-doc.t-centered .cv-header { text-align: center; border-bottom: none; padding-bottom: 6pt; }
.cv-doc.t-centered .cv-contact { justify-content: center; }
.cv-doc.t-centered .cv-title h2 { border-bottom: none; display: flex; align-items: center; gap: 8pt; }
.cv-doc.t-centered .cv-title h2::after { content: ""; flex: 1; height: .75pt; background: var(--cv-rule); }

/* Band: tinted header band, bold titles in accent. */
.cv-doc.t-band .cv-page:first-child .cv-header,
.cv-doc.t-band .cv-header {
  margin: calc(var(--cv-pad-top) * -1) calc(var(--cv-pad-x) * -1) 0;
  padding: var(--cv-pad-top) var(--cv-pad-x) 12pt;
  background: color-mix(in srgb, var(--cv-accent) 9%, #fff);
  border-bottom: 2pt solid var(--cv-accent);
}
.cv-doc.t-band .cv-title h2 { color: var(--cv-accent); border-bottom-color: color-mix(in srgb, var(--cv-accent) 30%, #fff); }