@page {
    size: 210mm 297mm;
    margin: 0;
}

@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('../fonts/Inter-Regular.woff2') format('woff2');
}
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url('../fonts/Inter-Bold.woff2') format('woff2');
}
@font-face {
    font-family: 'Playfair Display';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('../fonts/PlayfairDisplay-Regular.woff2') format('woff2');
}
@font-face {
    font-family: 'Playfair Display';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url('../fonts/PlayfairDisplay-Bold.woff2') format('woff2');
}
@font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('../fonts/Montserrat-Regular.woff2') format('woff2');
}
@font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url('../fonts/Montserrat-Bold.woff2') format('woff2');
}
@font-face {
    font-family: 'Dancing Script';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('../fonts/DancingScript-Regular.woff2') format('woff2');
}

.cv-doc.cv-font-inter {
    font-family: 'Inter', Arial, sans-serif;
}
.cv-doc.cv-font-playfair {
    font-family: 'Playfair Display', Georgia, serif;
}
.cv-doc.cv-font-montserrat {
    font-family: 'Montserrat', Arial, sans-serif;
}
.cl-signature-typed {
    font-family: 'Dancing Script', cursive;
    font-size: 1.3em;
    margin-right: 15.5rem;
}

.cv-page {
    position: relative;
    width: 210mm;
    height: 297mm;
    background: #fff;
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.15);
    overflow: hidden;
    margin-bottom: 20px;
    display: flex;
    flex-direction: column;
}

.cv-page-number {
    position: absolute;
    right: 2rem;
    bottom: 6mm;
    text-align: right;
    font-size: 9pt;
    color: #999;
}

.cv-doc {
    font-family: Arial, sans-serif;
    color: var(--cv-text, #222);
    font-size: 10.5pt;
    line-height: 1.4;
}

.cv-doc h2 {
    font-family: inherit;
    font-size: 12pt;
    margin: 0 0 8px;
    padding-bottom: 4px;
    border-bottom: 2px solid var(--cv-primary, rgba(0, 0, 0, 0.15));
    color: var(--cv-headers, inherit);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.cv-doc h3 {
    font-family: inherit;
    font-size: 11pt;
    margin: 0 0 6px;
    color: var(--cv-headers, inherit);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.cv-block {
    break-inside: avoid;
    margin-bottom: 20px;
}

.cv-header {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 10mm 15mm;
    color: #fff;
    flex-shrink: 0;
}

.cv-header-photo {
    width: 120px;
    height: 120px;
    border-radius: 50%;
    object-fit: cover;
    border: 3px solid rgba(255, 255, 255, 0.6);
    flex-shrink: 0;
}

.cv-header-photo-placeholder {
    background: rgba(255, 255, 255, 0.18);
}

.cv-header-name-block {
    flex: 1;
    min-width: 0;
}

.cv-header-name {
    font-size: 22pt;
    font-weight: bold;
    margin: 0;
}

.cv-header-job {
    font-size: 12pt;
    margin: 4px 0 0;
    opacity: 0.9;
    white-space: pre-line;
}

.cv-header-contact {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 8px;
    font-size: 11pt;
    flex-shrink: 0;
    text-align: right;
}

.cv-header-contact a,
.cv-header-contact span {
    color: inherit;
    text-decoration: none;
    opacity: 0.95;
    max-width: 55mm;
}

.cv-header-contact a:hover {
    text-decoration: underline;
}

.cv-body {
    display: flex;
    align-items: stretch;
    flex: 1;
    min-height: 0;
}

.cv-sidebar {
    width: 60mm;
    flex-shrink: 0;
    padding: 8mm 7mm;
    box-sizing: border-box;
    overflow: hidden;
}

/* Sidebar Position switch — mirrors the layout of ANY template, independent of
   which theme is chosen. */
.cv-doc.cv-mirror .cv-body {
    flex-direction: row-reverse;
}

/* Alternate photo/name/contact placement (sidebar instead of header) — hidden unless a theme opts in. */
.cv-sidebar-name-wrap,
.cv-sidebar-photo-wrap,
.cv-sidebar-contact,
.cv-sidebar-bottom-wave,
.cv-main-name-wrap,
.cv-side-accent-bar,
.cv-side-bg {
    display: none;
}

/* Theme 2 — a full-page-height background layer (same cv_bg_color as the
   sidebar) reaches the top of the page behind the header; the header itself
   gets a thin white border (its own box, not a gap) so it reads as a
   distinct card floating on that backdrop, plus badge-style section titles
   in the main column. Only the two normal color fields are used
   (cv_primary_color for the header, cv_bg_color for the sidebar/backdrop). */
.cv-doc.cv-theme-02 {
    position: relative;
}

.cv-doc.cv-theme-02 .cv-side-bg {
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 60mm;
    z-index: 0;
}

/* .cv-side-bg is position:absolute, so it never moves with the flex-based
   Sidebar Position mirror (unlike the real .cv-sidebar, whose own background
   is inline-styled and does move with it) — flip it to the right explicitly. */
.cv-doc.cv-theme-02.cv-mirror .cv-side-bg {
    left: auto;
    right: 0;
}

.cv-doc.cv-theme-02 .cv-body {
    position: relative;
    z-index: 1;
}

.cv-doc.cv-theme-02 .cv-header {
    position: relative;
    z-index: 1;
    margin: 8mm 12mm 0;
    border: 20px solid #fff;
    padding: 8mm 14mm;
    box-sizing: border-box;
    display: grid;
    grid-template-columns: auto 1fr;
    grid-template-rows: auto auto;
    column-gap: 52px;
    row-gap: 4px;
    align-items: center;
    justify-content: center;
}

.cv-doc.cv-theme-02 .cv-header-photo,
.cv-doc.cv-theme-02 .cv-header-photo-placeholder {
    grid-row: 1 / 3;
    grid-column: 1;
    margin-top: 8px;
}

.cv-doc.cv-theme-02 .cv-header-photo {
    width: 145px;
    height: 145px;
}

.cv-doc.cv-theme-02 .cv-header-name-block {
    grid-row: 1;
    grid-column: 2;
}

.cv-doc.cv-theme-02 .cv-header-contact {
    grid-row: 2;
    grid-column: 2;
    align-items: flex-start;
    text-align: left;
}

/* Adjacent-sibling selector so this only matches page 1's .cv-body (the only
   one with a .cv-header right before it) — pages 2+ have no header at all,
   so they must not get this extra top gap too. */
.cv-doc.cv-theme-02 .cv-header + .cv-body {
    margin-top: 6mm;
}

.cv-doc.cv-theme-02 .cv-sidebar {
    padding: 8mm 7mm;
}

.cv-doc.cv-theme-02 .cv-main {
    padding: 8mm 12mm;
}

/* Page 1 only (right after the header + its own gap) can afford a much
   tighter top padding — pages 2+ have no header above them and need the
   normal amount, or content reads as glued to the page edge. */
.cv-doc.cv-theme-02 .cv-header + .cv-body .cv-sidebar {
    padding-top: 1mm;
}

.cv-doc.cv-theme-02 .cv-header + .cv-body .cv-main {
    padding-top: 1mm;
}

.cv-doc.cv-theme-02 .cv-header-contact a,
.cv-doc.cv-theme-02 .cv-header-contact span {
    display: flex;
    align-items: center;
    gap: 6px;
}

.cv-doc.cv-theme-02 .cv-header-name {
    text-transform: uppercase;
    font-size: 27pt;
}

.cv-doc.cv-theme-02 .cv-main h2 {
    display: inline-block;
    background: var(--cv-primary, #2c8fa8);
    color: #fff;
    padding: 4px 14px;
    font-size: 10.5pt;
    border-bottom: none;
}

.cv-doc.cv-theme-02 .cv-tag {
    border-radius: 0;
}

/* Theme 3 — no colored header block; photo and contact info live in the sidebar instead. */
.cv-doc.cv-theme-03 .cv-header {
    background: var(--cv-bg, #fff) !important;
    border-bottom: 3px solid var(--cv-primary, #1a1a1a);
    padding: 10mm 15mm 10mm;
}

.cv-doc.cv-theme-03 .cv-header-photo,
.cv-doc.cv-theme-03 .cv-header-photo-placeholder,
.cv-doc.cv-theme-03 .cv-header-contact {
    display: none;
}

.cv-doc.cv-theme-03 .cv-header-name {
    color: var(--cv-primary, #1a1a1a);
    font-size: 26pt;
}

.cv-doc.cv-theme-03 .cv-header-job {
    color: var(--cv-headers, #555);
    opacity: 1;
    font-size: 11pt;
    margin-top: 6px;
}

.cv-doc.cv-theme-03 .cv-sidebar {
    border-right: 1px solid #e0e0e0;
}

.cv-doc.cv-theme-03.cv-mirror .cv-sidebar {
    border-right: none;
    border-left: 1px solid #e0e0e0;
}

.cv-doc.cv-theme-03 .cv-sidebar-photo-wrap {
    display: block;
    margin-bottom: 8mm;
}

.cv-doc.cv-theme-03 .cv-sidebar-photo {
    display: block;
    width: 100%;
    aspect-ratio: 1;
    object-fit: cover;
    border-radius: 4px;
    border: 1px solid var(--cv-primary, #ccc);
    box-sizing: border-box;
}

.cv-doc.cv-theme-03 .cv-sidebar-photo-placeholder {
    background: rgba(0, 0, 0, 0.06);
}

.cv-doc.cv-theme-03 .cv-sidebar-contact {
    display: block;
    margin-bottom: 8mm;
}

.cv-doc.cv-theme-03 .cv-sidebar-contact-row {
    margin-bottom: 8px;
    font-size: 11pt;
}

.cv-doc.cv-theme-03 .cv-sidebar-contact-row a {
    color: var(--cv-primary, inherit);
    text-decoration: none;
    word-break: break-word;
}

.cv-doc.cv-theme-03 .cv-sidebar-contact-label {
    display: block;
    font-weight: bold;
    color: var(--cv-headers, #1a1a1a);
    font-size: 10pt;
    text-transform: none;
    letter-spacing: 0.4px;
    margin-bottom: 2px;
}

.cv-doc.cv-theme-03 .cv-sidebar h3,
.cv-doc.cv-theme-03 .cv-sidebar-contact h3 {
    text-transform: uppercase;
    letter-spacing: 0;
    font-size: 10pt;
    border-bottom: 2px solid var(--cv-primary, rgba(0, 0, 0, 0.15));
}

.cv-doc.cv-theme-03 .cv-contact-name {
    display: none;
}

/* Theme 4 — full-height colored sidebar with a curved "wave" boundary, name +
   photo inside it, icon-led contact rows. No full-width header block. */
.cv-doc.cv-theme-04 .cv-header {
    display: none;
}

.cv-doc.cv-theme-04 .cv-sidebar {
    padding: 0 0 8mm;
    position: relative;
    overflow: hidden;
    background: var(--cv-bg, #eef7f6);
}

.cv-doc.cv-theme-04 .cv-sidebar-name-wrap {
    display: block;
    background: var(--cv-primary, #1a9c96);
    padding: 10mm 7mm 6mm;
    text-align: center;
}

.cv-doc.cv-theme-04 .cv-sidebar-name {
    color: #fff;
    font-size: 15pt;
    font-weight: bold;
    margin: 0;
}

.cv-doc.cv-theme-04 .cv-sidebar-job {
    color: #fff;
    opacity: 0.9;
    font-size: 11pt;
    margin: 4px 0 0;
}

.cv-doc.cv-theme-04 .cv-sidebar-photo-wrap {
    display: block;
    position: relative;
    background: var(--cv-primary, #1a9c96);
    text-align: center;
    padding: 0 0 16mm;
}

.cv-doc.cv-theme-04 .cv-sidebar-photo-wrap::after {
    content: '';
    position: absolute;
    left: -20%;
    right: -20%;
    bottom: -34px;
    height: 60px;
    background: var(--cv-bg, #eef7f6);
    border-radius: 50%;
}

.cv-doc.cv-theme-04 .cv-sidebar-photo {
    display: inline-block;
    width: 32mm;
    height: 32mm;
    border-radius: 50%;
    object-fit: cover;
    border: 3px solid #fff;
    position: relative;
    z-index: 1;
    box-sizing: border-box;
}

.cv-doc.cv-theme-04 .cv-sidebar-photo-placeholder {
    background: rgba(255, 255, 255, 0.25);
}

.cv-doc.cv-theme-04 .cv-sidebar-contact {
    display: block;
}

.cv-doc.cv-theme-04 .cv-sidebar-contact,
.cv-doc.cv-theme-04 .cv-sidebar > .cv-block {
    padding: 0 7mm;
    margin-top: 8mm;
}

.cv-doc.cv-theme-04 .cv-sidebar-contact h3,
.cv-doc.cv-theme-04 .cv-sidebar > .cv-block h3 {
    color: var(--cv-primary, #1a9c96);
    text-transform: none;
    letter-spacing: 0;
    font-size: 11pt;
    border-bottom: none;
    padding-bottom: 0;
}

.cv-doc.cv-theme-04 .cv-sidebar-contact-row {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
    font-size: 11pt;
}

.cv-doc.cv-theme-04 .cv-sidebar-contact-row a {
    color: inherit;
    text-decoration: none;
    word-break: break-word;
}

/* Icon replaces the text label for the 4 fields shown in the reference design;
   Age/Driving License (not in the reference) fall back to the plain text label.
   Shared by Theme 4 and Theme 5 — both reuse the same icon-led contact row style. */
.cv-doc.cv-theme-04 .cv-contact-name .cv-sidebar-contact-label,
.cv-doc.cv-theme-04 .cv-contact-email .cv-sidebar-contact-label,
.cv-doc.cv-theme-04 .cv-contact-phone .cv-sidebar-contact-label,
.cv-doc.cv-theme-04 .cv-contact-address .cv-sidebar-contact-label,
.cv-doc.cv-theme-05 .cv-contact-name .cv-sidebar-contact-label,
.cv-doc.cv-theme-05 .cv-contact-email .cv-sidebar-contact-label,
.cv-doc.cv-theme-05 .cv-contact-phone .cv-sidebar-contact-label,
.cv-doc.cv-theme-05 .cv-contact-address .cv-sidebar-contact-label {
    display: none;
}

.cv-doc.cv-theme-04 .cv-contact-name::before,
.cv-doc.cv-theme-04 .cv-contact-email::before,
.cv-doc.cv-theme-04 .cv-contact-phone::before,
.cv-doc.cv-theme-04 .cv-contact-address::before,
.cv-doc.cv-theme-05 .cv-contact-name::before,
.cv-doc.cv-theme-05 .cv-contact-email::before,
.cv-doc.cv-theme-05 .cv-contact-phone::before,
.cv-doc.cv-theme-05 .cv-contact-address::before {
    content: '';
    width: 15px;
    height: 15px;
    flex-shrink: 0;
    background: var(--cv-primary, #1a9c96);
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
}

/* Theme 2's icons sit on the colored header, not a light sidebar — white instead of primary. */
.cv-doc.cv-theme-02 .cv-contact-email::before,
.cv-doc.cv-theme-02 .cv-contact-phone::before,
.cv-doc.cv-theme-02 .cv-contact-address::before {
    content: '';
    width: 18px;
    height: 18px;
    flex-shrink: 0;
    background: #fff;
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
}

.cv-doc.cv-theme-04 .cv-contact-name::before,
.cv-doc.cv-theme-05 .cv-contact-name::before {
    -webkit-mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><circle cx="12" cy="8" r="4"/><path d="M4 20c0-4 4-6 8-6s8 2 8 6"/></svg>');
    mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><circle cx="12" cy="8" r="4"/><path d="M4 20c0-4 4-6 8-6s8 2 8 6"/></svg>');
}

.cv-doc.cv-theme-04 .cv-contact-name::before,
.cv-doc.cv-theme-04 .cv-contact-email::before,
.cv-doc.cv-theme-04 .cv-contact-phone::before,
.cv-doc.cv-theme-04 .cv-contact-address::before,
.cv-doc.cv-theme-05 .cv-contact-name::before,
.cv-doc.cv-theme-05 .cv-contact-email::before,
.cv-doc.cv-theme-05 .cv-contact-phone::before,
.cv-doc.cv-theme-05 .cv-contact-address::before {
    width: 20px;
    height: 20px;
}

.cv-doc.cv-theme-04 .cv-contact-email::before,
.cv-doc.cv-theme-05 .cv-contact-email::before,
.cv-doc.cv-theme-02 .cv-contact-email::before {
    -webkit-mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M3 5h18v14H3z" fill="none" stroke="black" stroke-width="2"/><path d="M3 5l9 7 9-7" fill="none" stroke="black" stroke-width="2"/></svg>');
    mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M3 5h18v14H3z" fill="none" stroke="black" stroke-width="2"/><path d="M3 5l9 7 9-7" fill="none" stroke="black" stroke-width="2"/></svg>');
}

.cv-doc.cv-theme-04 .cv-contact-phone::before,
.cv-doc.cv-theme-05 .cv-contact-phone::before,
.cv-doc.cv-theme-02 .cv-contact-phone::before {
    -webkit-mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M6.6 10.8c1.5 3 4 5.5 7 7l2.3-2.3c.3-.3.7-.4 1.1-.3 1.2.4 2.5.6 3.9.6.6 0 1 .4 1 1V21c0 .6-.4 1-1 1C10.9 22 2 13.1 2 2.9 2 2.4 2.4 2 3 2h4.2c.6 0 1 .4 1 1 0 1.4.2 2.7.6 3.9.1.4 0 .8-.3 1.1L6.6 10.8z"/></svg>');
    mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M6.6 10.8c1.5 3 4 5.5 7 7l2.3-2.3c.3-.3.7-.4 1.1-.3 1.2.4 2.5.6 3.9.6.6 0 1 .4 1 1V21c0 .6-.4 1-1 1C10.9 22 2 13.1 2 2.9 2 2.4 2.4 2 3 2h4.2c.6 0 1 .4 1 1 0 1.4.2 2.7.6 3.9.1.4 0 .8-.3 1.1L6.6 10.8z"/></svg>');
}

.cv-doc.cv-theme-04 .cv-contact-address::before,
.cv-doc.cv-theme-05 .cv-contact-address::before,
.cv-doc.cv-theme-02 .cv-contact-address::before {
    -webkit-mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 3l9 8h-3v9h-5v-6H11v6H6v-9H3z"/></svg>');
    mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 3l9 8h-3v9h-5v-6H11v6H6v-9H3z"/></svg>');
}

/* Bottom "wave" cap — closes off the sidebar at the foot of every page, the
   inverse of the top zone, reserved out of the page-packing budget so
   content never runs under it (see computePages()' bottomReserve). */
.cv-doc.cv-theme-04 .cv-sidebar-bottom-wave {
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 14mm;
    background: var(--cv-primary, #1a9c96);
}

.cv-doc.cv-theme-04 .cv-sidebar-bottom-wave::before {
    content: '';
    position: absolute;
    left: -20%;
    right: -20%;
    top: -30px;
    height: 60px;
    background: var(--cv-primary, #1a9c96);
    border-radius: 50%;
}

.cv-doc.cv-theme-04 .cv-main h2 {
    color: var(--cv-primary, #1a9c96);
    text-transform: none;
    letter-spacing: 0;
    font-size: 13pt;
    border-bottom: none;
    padding-bottom: 0;
}

/* Theme 5 — no header bar; name/job sits at the top of the main column, a
   thin accent bar runs down the page's left edge, sidebar is a plain pale
   panel (no wave), photo is a rounded portrait rather than a circle. */
.cv-doc.cv-theme-05 {
    position: relative;
}

.cv-doc.cv-theme-05 .cv-header {
    display: none;
}

.cv-doc.cv-theme-05 .cv-side-accent-bar {
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 5mm;
}

.cv-doc.cv-theme-05.cv-mirror .cv-side-accent-bar {
    left: auto;
    right: 0;
}

.cv-doc.cv-theme-05 .cv-sidebar {
    width: 68mm;
}

.cv-doc.cv-theme-05 .cv-sidebar-photo-wrap {
    display: block;
    text-align: center;
    padding: 5mm 4mm 6mm 9mm;
}

.cv-doc.cv-theme-05.cv-mirror .cv-sidebar-photo-wrap {
    padding: 5mm 9mm 6mm 4mm;
}

.cv-doc.cv-theme-05 .cv-sidebar-photo {
    display: inline-block;
    width: 34mm;
    height: 40mm;
    object-fit: cover;
    border-radius: 6mm;
    box-sizing: border-box;
}

.cv-doc.cv-theme-05 .cv-sidebar-photo-placeholder {
    background: rgba(0, 0, 0, 0.08);
}

.cv-doc.cv-theme-05 .cv-sidebar-contact {
    display: block;
}

.cv-doc.cv-theme-05 .cv-sidebar-contact,
.cv-doc.cv-theme-05 .cv-sidebar > .cv-block {
    padding: 0 2mm 0 4mm;
    margin-top: 6mm;
}

/* Page 2+: no .cv-sidebar-extra above it, so this block is the sidebar's
   literal first child — the sidebar's own 8mm top padding already provides
   the gap, so the 6mm margin-top above would double it up. */
.cv-doc.cv-theme-05 .cv-sidebar > .cv-block:first-child {
    margin-top: 0;
}

.cv-doc.cv-theme-05.cv-mirror .cv-sidebar-contact,
.cv-doc.cv-theme-05.cv-mirror .cv-sidebar > .cv-block {
    padding: 0 4mm 0 2mm;
}

.cv-doc.cv-theme-05 .cv-sidebar-contact-row {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
    font-size: 11pt;
}

.cv-doc.cv-theme-04 .cv-contact-name,
.cv-doc.cv-theme-05 .cv-contact-name {
    display: none !important;
}

.cv-doc.cv-theme-05 .cv-sidebar-item {
    font-size: 11pt;
}

.cv-doc.cv-theme-05 .cv-tag {
    font-size: 11pt;
}

.cv-doc.cv-theme-05 .cv-sidebar-contact-row a {
    color: inherit;
    text-decoration: none;
    word-break: break-word;
}

.cv-doc.cv-theme-05 .cv-sidebar h3,
.cv-doc.cv-theme-05 .cv-sidebar-contact h3 {
    color: var(--cv-primary, #a8326b);
    text-transform: none;
    letter-spacing: 0;
    font-size: 11pt;
}

.cv-doc.cv-theme-05 .cv-main-name-wrap {
    display: block;
    margin-bottom: 6mm;
}

.cv-doc.cv-theme-05 .cv-main-name {
    color: var(--cv-primary, #a8326b);
    font-size: 24pt;
    font-weight: bold;
    margin: 0;
}

.cv-doc.cv-theme-05 .cv-main-job {
    color: var(--cv-headers, #555);
    font-size: 11pt;
    margin: 4px 0 0;
}

.cv-doc.cv-theme-05 .cv-main h2 {
    color: var(--cv-primary, #a8326b);
    text-transform: none;
    letter-spacing: 0;
    font-size: 13pt;
    border-bottom: none;
    padding-bottom: 0;
}

.cv-doc.cv-theme-03 .cv-main h2 {
    text-transform: none;
    letter-spacing: 0;
    font-size: 13pt;
}

.cv-main {
    flex: 1;
    padding: 8mm 12mm;
    box-sizing: border-box;
    overflow: hidden;
}

/* Themes 4 and 5 have no header pushing content down, so the default 8mm
   top padding reads as too tight against the page edge — extra room here. */
.cv-doc.cv-theme-04 .cv-main,
.cv-doc.cv-theme-05 .cv-main {
    padding-top: 10mm;
}

.cv-entry-head {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 10px;
}

.cv-entry-title {
    font-weight: bold;
}

.cv-entry-dates {
    font-size: 10.5pt;
    font-weight: 600;
    color: var(--cv-primary, #666);
    white-space: nowrap;
    flex-shrink: 0;
}

.cv-entry-sub {
    font-style: italic;
    font-size: 11pt;
    color: var(--cv-primary, inherit);
    margin: 2px 0 4px;
}

.cv-entry-desc {
    font-size: 11pt;
    margin-top: 4px;
    white-space: pre-line;
}

.cv-sidebar-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 6px;
    font-size: 11pt;
    margin-bottom: 6px;
}

.cv-item-label {
    flex: 1;
    min-width: 0;
}

.cv-level-dots {
    display: inline-flex;
    gap: 3px;
    flex-shrink: 0;
}

.cv-level-dots .dot {
    width: 9px;
    height: 9px;
    flex-shrink: 0;
    border-radius: 50%;
    border: 1.5px solid var(--cv-primary, #999);
    box-sizing: border-box;
}

.cv-level-dots .dot.on {
    background: var(--cv-primary, #333);
}

.cv-sidebar-item a {
    color: var(--cv-primary, inherit);
    text-decoration: underline;
    word-break: break-all;
}

.cv-tag-list {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 2px;
}

.cv-tag {
    background: var(--cv-primary, #999);
    color: #fff;
    font-size: 11pt;
    padding: 3px 9px;
    border-radius: 10px;
    line-height: 1.3;
    max-width: 100%;
    overflow-wrap: break-word;
    box-sizing: border-box;
}

.cv-qr-wrap {
    text-align: center;
}

.cv-qr-wrap .cv-qr {
    display: inline-block;
}

.cv-qr-caption {
    justify-content: center;
    margin-top: 8px;
}

.cv-summary {
    font-size: 11pt;
}

.cv-qr {
    width: 90px;
    height: 90px;
}

.rsb-qr-print-page {
    display: none;
}

/* Cover letter rendering — deliberately simpler than the CV's cv-doc/cv-page
   engine: a letter is one page by nature (see the 4 reference designs this
   was scoped from), so there's no JS bin-packing here. min-height (not a
   fixed height + overflow:hidden like .cv-page) means a long letter just
   grows/prints onto a natural second page via the browser instead of being
   silently clipped. */
.cl-doc {
    font-family: Arial, sans-serif;
    color: #222;
    font-size: 11pt;
    line-height: 1.5;
}
.cl-doc.cl-font-inter {
    font-family: 'Inter', Arial, sans-serif;
}
.cl-doc.cl-font-playfair {
    font-family: 'Playfair Display', Georgia, serif;
}
.cl-doc.cl-font-montserrat {
    font-family: 'Montserrat', Arial, sans-serif;
}

.cl-page {
    position: relative;
    width: 210mm;
    height: 297mm;
    background: #fff;
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.15);
    overflow: hidden;
    margin-bottom: 20px;
    display: flex;
    box-sizing: border-box;
}

.cl-page-number {
    position: absolute;
    right: 2rem;
    bottom: 6mm;
    text-align: right;
    font-size: 9pt;
    color: #999;
}

/* Combined with the theme selector (not a standalone .cl-mirror rule) so it
   always wins over .cl-theme-01/.cl-theme-02's own flex-direction — two
   single-class selectors have equal specificity, so whichever is declared
   later in the file would otherwise win regardless of which classes are
   actually present on the element. Only meaningful for the Sidebar theme —
   Top Banner has no sidebar to mirror. */
.cl-theme-01.cl-mirror {
    flex-direction: row-reverse;
}

/* Theme "Sidebar" (letter_01) — colored sidebar with sender identity,
   white main column with the letter body. */
.cl-theme-01 {
    flex-direction: row;
}
.cl-theme-01 .cl-sidebar {
    width: 60mm;
    flex: 0 0 60mm;
    background: var(--cl-primary, #7a7a7a);
    color: #fff;
    padding: 14mm 8mm;
    box-sizing: border-box;
    position: relative;
    overflow: hidden;
}
.cl-theme-01 .cl-sidebar-name {
    font-size: 14pt;
    font-weight: 700;
    margin: 0 0 12px;
    word-break: break-word;
}
.cl-theme-01 .cl-sidebar-row {
    display: flex;
    align-items: flex-start;
    gap: 6px;
    font-size: 9.5pt;
    margin: 0 0 6px;
    white-space: pre-line;
    word-break: break-word;
}
/* Wave removed for now on this basic sidebar model — didn't read as
   intentional, kept as a class so it can come back on a future theme. */
.cl-theme-01 .cl-sidebar-bottom-wave {
    display: none;
}
.cl-theme-01 .cl-main {
    flex: 1;
    padding: 14mm 14mm;
    box-sizing: border-box;
}

/* Theme "Top Banner" (letter_02) — full-width color bar, single column. */
.cl-theme-02 {
    flex-direction: column;
}
.cl-theme-02 .cl-banner {
    background: var(--cl-primary, #7a7a7a);
    color: #fff;
    padding: 10mm 14mm;
    box-sizing: border-box;
}
.cl-theme-02 .cl-banner-name {
    font-size: 16pt;
    font-weight: 700;
    margin: 0 0 4px;
}
.cl-theme-02 .cl-banner-contact {
    display: flex;
    flex-wrap: wrap;
    gap: 4px 16px;
    font-size: 9.5pt;
}
.cl-theme-02 .cl-banner-contact span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.cl-theme-02 .cl-main {
    padding: 12mm 14mm;
    box-sizing: border-box;
}

/* Theme "Minimal" (letter_03) — classic administrative letter: no color
   block at all, just a thin accent rule under the name. Closest to the two
   competitor references (CV.fr-6, CV.fr-7) that don't use a colored
   sidebar/banner. */
.cl-theme-03 {
    flex-direction: column;
}
.cl-theme-03 .cl-header-block {
    padding: 14mm 14mm 6mm;
    box-sizing: border-box;
    border-top: 4px solid var(--cl-primary, #7a7a7a);
}
.cl-theme-03 .cl-header-name {
    font-size: 16pt;
    font-weight: 700;
    color: var(--cl-secondary, #1a1a1a);
    margin: 10px 0 6px;
}
.cl-theme-03 .cl-header-contact {
    display: flex;
    flex-wrap: wrap;
    gap: 4px 16px;
    font-size: 9.5pt;
    color: var(--cl-text, #222);
}
.cl-theme-03 .cl-header-contact span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.cl-theme-03 .cl-main {
    padding: 0 14mm 14mm;
    box-sizing: border-box;
}
/* Page 1 sits right below .cl-header-block (which already has its own
   bottom padding), but page 2+ has no header above it at all — without
   this, continuation pages start with text flush against the top edge. */
.cl-theme-03 .cl-main.cl-main-continued {
    padding-top: 14mm;
}
/* Classic French business-letter convention, stacked in reading order:
   recipient block (right-positioned column, text left-aligned — a
   multi-line address right-justified reads badly), then the date right
   below it (same column, text right-aligned this time), then Objet full
   width. Recipient and date share the same margin-left:auto + max-width so
   their right edges land on the same vertical line. */
.cl-theme-03 .cl-recipient {
    margin-left: auto;
    max-width: 70mm;
    text-align: left;
    margin-bottom: 8px;
}
.cl-theme-03 .cl-city-date {
    margin-left: auto;
    max-width: 70mm;
    text-align: left;
    margin-bottom: 20px;
}

/* Small contact-row icons (email/phone/address), same envelope/phone/house
   glyphs as the CV's Theme 4/5 (.cv-contact-*::before in this file). */
.cl-contact-email::before,
.cl-contact-phone::before,
.cl-contact-address::before {
    content: '';
    display: inline-block;
    width: 15px;
    height: 15px;
    flex-shrink: 0;
    background: currentColor;
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
}
.cl-contact-email::before {
    -webkit-mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M3 5h18v14H3z" fill="none" stroke="black" stroke-width="2"/><path d="M3 5l9 7 9-7" fill="none" stroke="black" stroke-width="2"/></svg>');
    mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M3 5h18v14H3z" fill="none" stroke="black" stroke-width="2"/><path d="M3 5l9 7 9-7" fill="none" stroke="black" stroke-width="2"/></svg>');
}
.cl-contact-phone::before {
    -webkit-mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M6.6 10.8c1.5 3 4 5.5 7 7l2.3-2.3c.3-.3.7-.4 1.1-.3 1.2.4 2.5.6 3.9.6.6 0 1 .4 1 1V21c0 .6-.4 1-1 1C10.9 22 2 13.1 2 2.9 2 2.4 2.4 2 3 2h4.2c.6 0 1 .4 1 1 0 1.4.2 2.7.6 3.9.1.4 0 .8-.3 1.1L6.6 10.8z"/></svg>');
    mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M6.6 10.8c1.5 3 4 5.5 7 7l2.3-2.3c.3-.3.7-.4 1.1-.3 1.2.4 2.5.6 3.9.6.6 0 1 .4 1 1V21c0 .6-.4 1-1 1C10.9 22 2 13.1 2 2.9 2 2.4 2.4 2 3 2h4.2c.6 0 1 .4 1 1 0 1.4.2 2.7.6 3.9.1.4 0 .8-.3 1.1L6.6 10.8z"/></svg>');
}
.cl-contact-address::before {
    -webkit-mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 3l9 8h-3v9h-5v-6H11v6H6v-9H3z"/></svg>');
    mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 3l9 8h-3v9h-5v-6H11v6H6v-9H3z"/></svg>');
}
.cl-theme-01 .cl-contact-address {
    align-items: flex-start;
}
.cl-theme-01 .cl-contact-address::before {
    margin-top: 2px;
}

/* Shared main-column content, both themes. Recipient block + city/date sit
   side by side at the same height, city/date right-aligned. */
.cl-main-top {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 16px;
    margin-bottom: 16px;
}
.cl-recipient {
    white-space: pre-line;
    margin: 0;
}
.cl-city-date {
    text-align: right;
    white-space: nowrap;
    flex-shrink: 0;
    margin: 0;
}
.cl-subject {
    font-weight: 700;
    color: var(--cl-secondary, #1a1a1a);
    margin-bottom: 6px;
}
.cl-job-meta {
    font-size: 9.5pt;
    color: #666;
    margin: 0 0 14px;
}
.cl-body {
    color: var(--cl-text, #222);
    margin-bottom: 16px;
}
.cl-body p {
    color: var(--cl-text, #222);
    margin: 0 0 10px;
    /* Lighter-weight alternative to the CV's custom bin-packing pagination:
       a letter is flowing prose, so it's fine for it to spill onto a 2nd
       page naturally — this just avoids a single paragraph being split mid-
       sentence across the page break (an orphan line at the very bottom or
       top of a page), same idea browsers apply to table rows. */
    break-inside: avoid;
    page-break-inside: avoid;
}
.cl-signature-block {
    text-align: right;
    break-inside: avoid;
    page-break-inside: avoid;
}
.cl-signature-block img {
    display: inline-block;
    height: auto;
    max-width: 100%;
    margin-top: 6px;
    margin-right: 4rem;
}
.cl-footer {
    margin-top: 16px;
    font-size: 9pt;
    color: #888;
}

@media print {
    body.rsb-printing-qr *:not(.rsb-qr-print-page):not(.rsb-qr-print-page *):not(:has(.rsb-qr-print-page)) {
        display: none !important;
    }
    body.rsb-printing-qr *:has(.rsb-qr-print-page) {
        max-width: none !important;
        width: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        background: none !important;
    }
    body.rsb-printing-qr .rsb-qr-print-page {
        display: flex !important;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        width: 210mm;
        min-height: 297mm;
        background: #fff;
        padding: 20mm;
        box-sizing: border-box;
        text-align: center;
        margin: 0 auto;
    }
    body.rsb-printing-qr .rsb-qr-print-page h2 {
        font-size: 18pt;
        margin: 0 0 6px;
    }
    body.rsb-printing-qr .rsb-qr-print-sub {
        color: #666;
        margin: 0 0 24px;
    }
    body.rsb-printing-qr .rsb-qr-print-credit {
        margin-top: 24px;
        font-size: 11pt;
        color: #999;
    }
    body.rsb-printing-qr .rsb-qr-print-credit .rsb-heart {
        color: #e63946;
    }
    body.rsb-printing-qr .rsb-qr-print-credit a {
        color: inherit;
    }
}

@media print {
    * {
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
        color-adjust: exact !important;
    }
    body:not(.rsb-printing-qr) *:not(#rsb-editor-root):not(#rsb-editor-root *):not(:has(#rsb-editor-root)):not(#rsb-letter-root):not(#rsb-letter-root *):not(:has(#rsb-letter-root)) {
        display: none !important;
    }
    body *:has(#rsb-editor-root),
    body *:has(#rsb-letter-root) {
        margin: 0 !important;
        padding: 0 !important;
        min-height: 0 !important;
        height: auto !important;
    }
    .rsb-form-panel,
    .rsb-view-actions,
    .rsb-view-qr,
    .rsb-view-credit,
    .rsb-preview-btn {
        display: none !important;
    }
    body:not(.rsb-printing-qr) .rsb-qr-modal-overlay {
        display: none !important;
    }
    .rsb-preview-panel,
    .rsb-cv-pages {
        overflow: visible !important;
        max-height: none !important;
        height: auto !important;
    }
    .rsb-preview-panel {
        position: static !important;
        top: auto !important;
        bottom: auto !important;
        left: auto !important;
        right: auto !important;
        transform: none !important;
        box-shadow: none !important;
        border-radius: 0 !important;
        padding-top: 0 !important;
        background: none !important;
        display: block !important;
    }
    .rsb-cv-pages {
        transform: none !important;
    }
    .cv-page {
        margin-bottom: 0;
        box-shadow: none;
        page-break-after: always;
        break-after: page;
    }
    .cv-page:last-child {
        page-break-after: auto;
        break-after: auto;
    }
    .cl-page {
        margin-bottom: 0;
        box-shadow: none;
        page-break-after: always;
        break-after: page;
    }
    .cl-page:last-child {
        page-break-after: auto;
        break-after: auto;
    }
}

.cv-project-image {
    max-width: 100%;
    height: auto;
    margin: 16px auto 0;
    display: block;
}