/* پێناس — CV page styles (A4). Everything uses em + logical properties so RTL mirrors automatically. */
.cv {
  --ink: #1f2933; --muted: #5f6b7a;
  --soft: color-mix(in srgb, var(--accent) 9%, #fff);
  --line: color-mix(in srgb, var(--accent) 24%, #fff);
  width: 210mm; min-height: 297mm; background: #fff; color: var(--ink);
  font-size: calc(13.5px * var(--k, 1)); line-height: 1.5;
  display: grid; position: relative; box-sizing: border-box; overflow-wrap: anywhere;
  -webkit-print-color-adjust: exact; print-color-adjust: exact; text-align: start;
}
.cv *, .cv *::before, .cv *::after { box-sizing: border-box; }
.cv h1, .cv h2, .cv p, .cv ul { margin: 0; padding: 0; }
.cv ul { list-style: none; }
.cv[dir=rtl] * { letter-spacing: 0 !important; text-transform: none !important; }

.cv .hd { grid-area: hd; }
.cv .side { grid-area: side; }
.cv .main { grid-area: main; }

.cv h1 { font-size: 2.3em; line-height: 1.2; font-weight: 800; }
.cv .jt { font-size: 1.1em; color: var(--accent); font-weight: 600; }
.cv .ph { width: 7.5em; height: 7.5em; border-radius: var(--phr); overflow: hidden; flex: none; }
.cv .ph img { width: 100%; height: 100%; object-fit: cover; display: block; }
.cv .ct { display: flex; flex-direction: column; gap: .35em; }
.cv .ct li { display: flex; gap: .55em; align-items: center; }
.cv .ct svg { width: 1em; height: 1em; stroke: currentColor; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; flex: none; }
.cv .sec { margin-bottom: 1.25em; }
.cv .sec h2 { font-size: 1.05em; font-weight: 800; color: var(--accent); margin-bottom: .55em; }
.cv .it { margin-bottom: .9em; break-inside: avoid; }
.cv .it-h { display: flex; justify-content: space-between; gap: 1em; align-items: baseline; }
.cv .it-h b { font-weight: 700; }
.cv .dt { color: var(--muted); font-size: .85em; white-space: nowrap; }
.cv .it-s { color: var(--accent); font-weight: 600; font-size: .93em; }
.cv .it p, .cv .it ul { margin-top: .25em; color: #3b4654; }
.cv .it ul li { position: relative; padding-inline-start: 1.1em; }
.cv .it ul li::before { content: ''; position: absolute; inset-inline-start: .15em; top: .62em; width: .36em; height: .36em; border-radius: 50%; background: var(--accent); }
.cv .chips { display: flex; flex-wrap: wrap; gap: .35em; }
.cv .chip { padding: .12em .75em; border-radius: 99px; background: var(--soft); border: 1px solid var(--line); font-size: .93em; }
.cv .sk { margin-bottom: .6em; }
.cv .sk span { display: block; font-size: .93em; }
.cv .bar { display: block; height: .38em; border-radius: 9px; background: rgba(0,0,0,.1); overflow: hidden; margin-top: .2em; }
.cv .bar u { display: block; height: 100%; background: var(--accent); }
.cv .sk.dots { display: flex; justify-content: space-between; align-items: center; gap: .6em; margin-bottom: .45em; }
.cv .sk.dots span { display: inline; }
.cv .sk.dots b { display: inline-flex; gap: .2em; }
.cv .sk.dots i { width: .56em; height: .56em; border-radius: 50%; background: rgba(0,0,0,.16); }
.cv .sk.dots i.on { background: var(--accent); }
.cv .lg { display: flex; justify-content: space-between; gap: .6em; margin-bottom: .3em; font-size: .95em; }
.cv .lg span { color: var(--muted); font-size: .9em; }

/* dark (accent-coloured) sidebars */
.cv.dk .side { color: #fff; }
.cv.dk .side h2 { color: #fff; border-bottom: 1px solid rgba(255,255,255,.35); padding-bottom: .3em; }
.cv.dk .side .chip { background: rgba(255,255,255,.16); border-color: transparent; color: #fff; }
.cv.dk .side .bar, .cv.dk .side .dots i { background: rgba(255,255,255,.28); }
.cv.dk .side .bar u, .cv.dk .side .dots i.on { background: #fff; }
.cv.dk .side .lg span { color: rgba(255,255,255,.8); }

/* ───────── 1 classic ───────── */
.l-classic { grid-template-areas: "hd" "main"; grid-template-rows: auto 1fr; }
.l-classic .hd { padding: 2.2em 2.6em 1.3em; text-align: center; border-bottom: .28em solid var(--accent); display: flex; flex-direction: column; align-items: center; gap: .55em; }
.l-classic .hd .ct { flex-direction: row; flex-wrap: wrap; justify-content: center; gap: .25em 1.3em; color: var(--muted); font-size: .92em; }
.l-classic .main { padding: 1.4em 2.6em 2.2em; }
.l-classic .sec h2 { text-transform: uppercase; letter-spacing: .06em; border-bottom: 1px solid var(--line); padding-bottom: .25em; }

/* ───────── 2 side / 3 sideend (accent sidebar, full height) ───────── */
.l-side, .l-sideend, .l-softside {
  background-image: linear-gradient(var(--accent), var(--accent)); background-repeat: no-repeat; background-size: 32% 100%;
}
.l-side { grid-template-columns: 32% 1fr; grid-template-areas: "side main"; }
.l-sideend { grid-template-columns: 1fr 32%; grid-template-areas: "main side"; }
.l-side[dir=ltr], .l-sideend[dir=rtl] { background-position: left top; }
.l-side[dir=rtl], .l-sideend[dir=ltr] { background-position: right top; }
.l-side .side, .l-sideend .side { padding: 2.2em 1.5em; }
.l-side .side .ph, .l-sideend .side .ph { width: 9em; height: 9em; margin: 0 auto 1.5em; border: .25em solid rgba(255,255,255,.4); }
.l-side .side .ct, .l-sideend .side .ct { font-size: .9em; }
.l-side .main, .l-sideend .main { padding: 2.4em 2.2em; }
.l-side .main .id, .l-sideend .main .id, .l-softside .main .id { margin-bottom: 1.5em; padding-bottom: 1em; border-bottom: .22em solid var(--accent); }
.l-side .main .sec h2, .l-sideend .main .sec h2 { text-transform: uppercase; letter-spacing: .08em; border-bottom: 1px solid var(--line); padding-bottom: .25em; }

/* ───────── 4 banner ───────── */
.l-banner { grid-template-columns: 1fr 31%; grid-template-areas: "hd hd" "main side"; grid-template-rows: auto 1fr; }
.l-banner .hd { background: var(--accent); color: #fff; padding: 2em 2.6em; display: flex; align-items: center; gap: 1.6em; }
.l-banner .hd .jt { color: rgba(255,255,255,.88); }
.l-banner .hd .ph { border: .22em solid rgba(255,255,255,.5); }
.l-banner .side { background: var(--soft); padding: 1.6em 1.5em; }
.l-banner .main { padding: 1.6em 2.2em; }
.l-banner .sec h2 { text-transform: uppercase; letter-spacing: .06em; }

/* ───────── 5 minimal ───────── */
.l-minimal { grid-template-areas: "hd" "main"; grid-template-rows: auto 1fr; }
.l-minimal .hd { padding: 3em 3em 1.2em; display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 1em 2em; }
.l-minimal .hd .ct { grid-column: 1 / -1; flex-direction: row; flex-wrap: wrap; gap: .25em 1.4em; color: var(--muted); font-size: .9em; padding-top: .8em; border-top: 1px solid #e5e7eb; }
.l-minimal h1 { font-weight: 300; font-size: 2.8em; }
.l-minimal .jt { color: var(--muted); font-weight: 400; }
.l-minimal .main { padding: .6em 3em 2.4em; }
.l-minimal .sec { padding-top: 1em; border-top: 1px solid #e5e7eb; }
.l-minimal .sec:first-child { border-top: 0; }
.l-minimal .sec h2 { font-size: .8em; text-transform: uppercase; letter-spacing: .2em; margin-bottom: .8em; }

/* ───────── 6 timeline ───────── */
.l-timeline { grid-template-areas: "hd" "main"; grid-template-rows: auto 1fr; }
.l-timeline .hd { background: var(--soft); border-inline-start: .9em solid var(--accent); padding: 2em 2.4em; display: flex; align-items: center; gap: 1.6em; }
.l-timeline .hd .id { flex: 1; }
.l-timeline .hd .ct { font-size: .85em; color: var(--muted); }
.l-timeline .main { padding: 1.6em 2.6em 2.2em; }
.l-timeline .s-experience .it, .l-timeline .s-education .it { position: relative; padding-inline-start: 1.5em; border-inline-start: .15em solid var(--line); margin-bottom: 0; padding-bottom: 1.1em; }
.l-timeline .s-experience .it::before, .l-timeline .s-education .it::before { content: ''; position: absolute; inset-inline-start: -.48em; top: .35em; width: .8em; height: .8em; border-radius: 50%; background: #fff; border: .2em solid var(--accent); }
.l-timeline .sec h2 { display: flex; align-items: center; gap: .6em; }
.l-timeline .sec h2::after { content: ''; flex: 1; height: 2px; background: var(--line); }

/* ───────── 7 softside ───────── */
.l-softside { grid-template-columns: 32% 1fr; grid-template-areas: "side main"; background-image: linear-gradient(var(--soft), var(--soft)); }
.l-softside[dir=ltr] { background-position: left top; }
.l-softside[dir=rtl] { background-position: right top; }
.l-softside .side { padding: 2.2em 1.5em; }
.l-softside .side .ph { width: 9em; height: 9em; margin: 0 auto 1.5em; border: .25em solid #fff; box-shadow: 0 0 0 1px var(--line); }
.l-softside .side .ct { font-size: .9em; }
.l-softside .side .ct svg { stroke: var(--accent); }
.l-softside .main { padding: 2.4em 2.2em; }
.l-softside .side .sec h2 { text-transform: uppercase; letter-spacing: .08em; }
.l-softside .side .chip { background: #fff; }

/* ───────── 8 split ───────── */
.l-split { grid-template-areas: "hd" "main"; grid-template-rows: auto 1fr; }
.l-split .hd { padding: 2.4em 2.6em 1.4em; display: flex; align-items: flex-end; gap: 1.6em; border-bottom: .18em solid var(--ink); margin: 0 2.6em; padding-inline: 0; }
.l-split .hd .id { flex: 1; }
.l-split .hd .ct { font-size: .85em; color: var(--muted); }
.l-split .main { padding: .4em 2.6em 2em; }
.l-split .sec { display: grid; grid-template-columns: 21% 1fr; gap: 1.4em; padding: 1.1em 0 .4em; margin: 0; border-bottom: 1px solid #e5e7eb; }
.l-split .sec h2 { font-size: .95em; }

/* ───────── 9 bars ───────── */
.l-bars { grid-template-areas: "hd" "main"; grid-template-rows: auto 1fr; }
.l-bars .hd { text-align: center; padding: 2.2em 2.6em 1em; display: flex; flex-direction: column; align-items: center; gap: .5em; }
.l-bars .hd .ct { flex-direction: row; flex-wrap: wrap; justify-content: center; gap: .25em 1.3em; color: var(--muted); font-size: .9em; }
.l-bars .main { padding: .6em 2.6em 2.2em; }
.l-bars .sec h2 { background: var(--accent); color: #fff; padding: .3em .9em; border-radius: .35em; margin-bottom: .75em; }
.l-bars.alt .sec h2 { border-radius: 0; }
.l-bars .s-skills .sb { display: grid; grid-template-columns: 1fr 1fr; gap: .1em 2.2em; }

/* ───────── 10 compact ───────── */
.l-compact { font-size: calc(12.5px * var(--k, 1)); grid-template-columns: 1fr 34%; grid-template-areas: "hd hd" "main side"; grid-template-rows: auto 1fr; }
.l-compact .hd { display: flex; align-items: center; gap: 1.4em; margin: 1.8em 2.2em 0; padding-bottom: 1em; border-bottom: .15em solid var(--accent); }
.l-compact .ph { width: 6em; height: 6em; }
.l-compact h1 { font-size: 2em; }
.l-compact .main { padding: 1.3em 1.6em 2em 2.2em; }
.l-compact[dir=rtl] .main { padding: 1.3em 2.2em 2em 1.6em; }
.l-compact .side { padding: 1.3em 2.2em 2em 1.4em; border-inline-start: 1px solid var(--line); }
.l-compact[dir=rtl] .side { padding: 1.3em 1.4em 2em 2.2em; }
.l-compact .sec { margin-bottom: 1em; }

/* ───────── 11 circle ───────── */
.l-circle { grid-template-areas: "hd" "main"; grid-template-rows: auto 1fr; --phr: 50%; }
.l-circle .hd { display: flex; flex-direction: column; align-items: center; text-align: center; gap: .5em; padding: 2.2em 2.6em 1em; }
.l-circle .ph { width: 8.5em; height: 8.5em; border: .3em solid var(--accent); padding: .25em; background: #fff; border-radius: 50%; }
.l-circle .ph img { border-radius: 50%; }
.l-circle .jt { background: var(--accent); color: #fff; padding: .15em 1.1em; border-radius: 99px; font-size: 1em; margin-top: .4em; display: inline-block; }
.l-circle .hd .ct { flex-direction: row; flex-wrap: wrap; justify-content: center; gap: .3em .9em; font-size: .88em; margin-top: .4em; }
.l-circle .hd .ct li { background: var(--soft); border-radius: 99px; padding: .15em .8em; }
.l-circle .hd .ct svg { stroke: var(--accent); }
.l-circle .main { padding: .6em 2.6em 2.2em; }
.l-circle .sec h2 { display: inline-block; background: var(--soft); border: 1px solid var(--line); padding: .22em 1.1em; border-radius: 99px; margin-bottom: .8em; }

/* ───────── 12 elegant ───────── */
.l-elegant { grid-template-areas: "hd" "main"; grid-template-rows: auto 1fr; line-height: 1.6;
  box-shadow: inset 0 0 0 .5em #fff, inset 0 0 0 .62em var(--accent), inset 0 0 0 .8em #fff, inset 0 0 0 .87em var(--line); }
.l-elegant .hd { text-align: center; padding: 3em 3em 1.2em; display: flex; flex-direction: column; align-items: center; gap: .55em; }
.l-elegant h1 { font-size: 2.2em; letter-spacing: .1em; text-transform: uppercase; font-weight: 700; }
.l-elegant .jt { font-style: italic; font-weight: 400; color: var(--muted); }
.l-elegant .hd .ct { flex-direction: row; flex-wrap: wrap; justify-content: center; gap: .25em 1.2em; font-size: .88em; color: var(--muted); padding-top: .7em; margin-top: .3em; border-top: 1px solid var(--line); }
.l-elegant .main { padding: .6em 3.2em 3em; }
.l-elegant .sec h2 { display: flex; align-items: center; gap: .8em; text-align: center; font-size: 1em; text-transform: uppercase; letter-spacing: .12em; }
.l-elegant .sec h2::before, .l-elegant .sec h2::after { content: ''; flex: 1; height: 1px; background: var(--line); }

/* ───────── print ───────── */
@page { size: A4; margin: 0; }
@media print {
  html, body { background: #fff !important; }
  body > *:not(#printRoot) { display: none !important; }
  #printRoot { display: block !important; }
  #printRoot .cv { transform: none !important; box-shadow: none; }
}

/* multi-page: every printed fragment of a column keeps its own top/bottom padding */
.cv .main, .cv .side { -webkit-box-decoration-break: clone; box-decoration-break: clone; }

/* ───────── style (skin) overrides: heading design / name / photo ───────── */
.cv.hs-underline .main .sec h2,.cv.hs-underline:not(.dk) .side .sec h2{text-transform:none;letter-spacing:0;border:0;background:none;padding:0;border-radius:0;display:block;text-align:start;color:var(--accent);font-size:1.05em;font-weight:800;margin-bottom:.6em;line-height:1.4;border-bottom:2px solid var(--accent);padding-bottom:.25em;}
.cv.hs-caps .main .sec h2,.cv.hs-caps:not(.dk) .side .sec h2{text-transform:none;letter-spacing:0;border:0;background:none;padding:0;border-radius:0;display:block;text-align:start;color:var(--accent);font-size:1.05em;font-weight:800;margin-bottom:.6em;line-height:1.4;text-transform:uppercase;letter-spacing:.14em;font-size:.85em;border-bottom:1px solid var(--line);padding-bottom:.35em;}
.cv.hs-barleft .main .sec h2,.cv.hs-barleft:not(.dk) .side .sec h2{text-transform:none;letter-spacing:0;border:0;background:none;padding:0;border-radius:0;display:block;text-align:start;color:var(--accent);font-size:1.05em;font-weight:800;margin-bottom:.6em;line-height:1.4;border-inline-start:.32em solid var(--accent);padding-inline-start:.6em;line-height:1.25;}
.cv.hs-fill .main .sec h2,.cv.hs-fill:not(.dk) .side .sec h2{text-transform:none;letter-spacing:0;border:0;background:none;padding:0;border-radius:0;display:block;text-align:start;color:var(--accent);font-size:1.05em;font-weight:800;margin-bottom:.6em;line-height:1.4;background:var(--accent);color:#fff;padding:.28em .8em;border-radius:.25em;}
.cv.hs-pill .main .sec h2,.cv.hs-pill:not(.dk) .side .sec h2{text-transform:none;letter-spacing:0;border:0;background:none;padding:0;border-radius:0;display:block;text-align:start;color:var(--accent);font-size:1.05em;font-weight:800;margin-bottom:.6em;line-height:1.4;background:var(--soft);padding:.2em 1em;border-radius:99px;display:inline-block;border:1px solid var(--line);}
.cv.hs-ticks .main .sec h2,.cv.hs-ticks:not(.dk) .side .sec h2{text-transform:none;letter-spacing:0;border:0;background:none;padding:0;border-radius:0;display:block;text-align:start;color:var(--accent);font-size:1.05em;font-weight:800;margin-bottom:.6em;line-height:1.4;position:relative;padding-bottom:.55em;}
.cv.hs-center .main .sec h2,.cv.hs-center:not(.dk) .side .sec h2{text-transform:none;letter-spacing:0;border:0;background:none;padding:0;border-radius:0;display:block;text-align:start;color:var(--accent);font-size:1.05em;font-weight:800;margin-bottom:.6em;line-height:1.4;display:flex;align-items:center;gap:.7em;}
.cv.hs-dotted .main .sec h2,.cv.hs-dotted:not(.dk) .side .sec h2{text-transform:none;letter-spacing:0;border:0;background:none;padding:0;border-radius:0;display:block;text-align:start;color:var(--accent);font-size:1.05em;font-weight:800;margin-bottom:.6em;line-height:1.4;border-bottom:2px dotted var(--accent);padding-bottom:.25em;}
.cv.hs-box .main .sec h2,.cv.hs-box:not(.dk) .side .sec h2{text-transform:none;letter-spacing:0;border:0;background:none;padding:0;border-radius:0;display:block;text-align:start;color:var(--accent);font-size:1.05em;font-weight:800;margin-bottom:.6em;line-height:1.4;border:2px solid var(--accent);padding:.15em .75em;display:inline-block;border-radius:.2em;}
.cv.hs-ticks .main .sec h2::after,.cv.hs-ticks:not(.dk) .side .sec h2::after{content:'';position:absolute;bottom:0;inset-inline-start:0;width:2.4em;height:.22em;background:var(--accent);border-radius:9px}
.cv.hs-center .main .sec h2::before,.cv.hs-center:not(.dk) .side .sec h2::before,.cv.hs-center .main .sec h2::after,.cv.hs-center:not(.dk) .side .sec h2::after{content:'';flex:1;height:1px;background:var(--line)}
.cv.hs-caps[dir=rtl] .sec h2{font-size:1.05em}
.cv.nm-light h1{font-weight:300}
.cv.nm-bold h1{font-weight:800}
.cv.nm-caps h1{text-transform:uppercase;letter-spacing:.06em;font-size:2em}
.cv.nm-accent:not(.l-banner) h1{color:var(--accent)}
.cv.hs-fill .main .sec h2,.cv.hs-fill:not(.dk) .side .sec h2{color:#fff}

/* printing is only allowed through the Save-as-PDF button (it adds body.allow-print after the server approves) */
@media print {
  body:not(.allow-print) > * { display: none !important; }
  body:not(.allow-print)::before { content: 'پێناس — use the Save as PDF button'; display: block; padding: 40px; font: 16px sans-serif; }
}