/* ═══════════════════════════════════════════════════════════
   Browser Print stylesheet
   NOT loaded for WeasyPrint PDF (pdf.css overrides @page there).
   ═══════════════════════════════════════════════════════════ */

/* @page padding-top creates breathing room at the top of every
   page (including after page breaks) at the layout-engine level,
   which is the only mechanism browsers/WeasyPrint apply before
   any content is placed on the new page. */
@page {
  size: A4 portrait;
  margin: 0;
}

/* First page: header already sits at the top, no extra gap needed. */
@page :first {
  padding-top: 0;
}

/* ── Ensure backgrounds & colors print ───────────────────── */
* {
  -webkit-print-color-adjust: exact;
  print-color-adjust: exact;
}

/* ── Font: bigger than old print (8.5pt), smaller than screen ─ */
html {
  font-size: 10pt;
}

/* ── Remove screen chrome ────────────────────────────────── */
body {
  background: #ffffff;
  padding: 0;
  margin: 0;
}

.resume {
  box-shadow: none;
  max-width: none;
  width: 100%;
  margin: 0;
}

/* ── Header: always horizontal ───────────────────────────── */
.header {
  flex-direction: row !important;
  text-align: left !important;
  padding: 1rem 1.2rem !important;
}

.header-identity {
  flex-direction: row !important;
  align-items: center !important;
}

.header-contacts {
  text-align: right !important;
}

/* ── Body: display:table for reliable cross-page columns ─── */
.body {
  display: table !important;
  width: 100% !important;
  border-collapse: collapse !important;
}

.sidebar,
.timeline-col,
.rightcol {
  display: table-cell !important;
  vertical-align: top !important;
}

.sidebar {
  width: 23% !important;
}

.rightcol {
  width: 23% !important;
}

.timeline-year-badge {
  flex: 0 0 40px;
  height: 15px;
  font-size: 0.5rem;
}

/* Small dot connecting badge to line */
.timeline-content::before {
  top: 18px;
  left: -4px;
  width: 6px;
  height: 6px;
}

/* ── Avoid orphaned entries mid-page ─────────────────────── */
.timeline-entry,
.edu-entry,
.skill-item,
.skill-group {
  break-inside: avoid;
}

/* ── Header links stay white ─────────────────────────────── */
.header a,
.contact-value {
  color: #ffffff;
}

.header-contact-item > .icon {
  color: rgba(255, 255, 255, 0.8);
}

.avatar {
  width: 75px !important;
  height: 75px !important;
}

/* Add spacing after page break */
.skill-group {
  margin-bottom: 0;
}

.skill-group h3 {
  padding-top: 1rem;
}

.section-title + .skill-group h3 {
  padding-top: 0rem;
}

.no-print {
  display: none !important;
}

.skip-link {
  display: none !important;
}

.print-only {
  display: inline !important;
}

/* ── QR code in sidebar ──────────────────────────────────── */
.sidebar-qrcode {
  display: block !important;
  text-align: center;
  margin-top: auto;
}

.sidebar-qrcode .qrcode {
  width: 80%;
  max-width: 150px;
  height: auto;
}