/* CV shablonlari — fizik birliklar (mm, pt). Shriftlar PDF dagi bilan bir xil (Liberation, SIL OFL). */
@font-face { font-family: "CV Sans"; font-weight: 400; font-style: normal; font-display: swap;
  src: url("../../shared/fonts/web/LiberationSans-Regular.woff2") format("woff2"),
       url("../../shared/fonts/LiberationSans-Regular.ttf") format("truetype"); }
@font-face { font-family: "CV Sans"; font-weight: 700; font-style: normal; font-display: swap;
  src: url("../../shared/fonts/web/LiberationSans-Bold.woff2") format("woff2"),
       url("../../shared/fonts/LiberationSans-Bold.ttf") format("truetype"); }
@font-face { font-family: "CV Sans"; font-weight: 400; font-style: italic; font-display: swap;
  src: url("../../shared/fonts/web/LiberationSans-Italic.woff2") format("woff2"),
       url("../../shared/fonts/LiberationSans-Italic.ttf") format("truetype"); }
@font-face { font-family: "CV Serif"; font-weight: 400; font-style: normal; font-display: swap;
  src: url("../../shared/fonts/web/LiberationSerif-Regular.woff2") format("woff2"),
       url("../../shared/fonts/LiberationSerif-Regular.ttf") format("truetype"); }
@font-face { font-family: "CV Serif"; font-weight: 700; font-style: normal; font-display: swap;
  src: url("../../shared/fonts/web/LiberationSerif-Bold.woff2") format("woff2"),
       url("../../shared/fonts/LiberationSerif-Bold.ttf") format("truetype"); }
@font-face { font-family: "CV Serif"; font-weight: 400; font-style: italic; font-display: swap;
  src: url("../../shared/fonts/web/LiberationSerif-Italic.woff2") format("woff2"),
       url("../../shared/fonts/LiberationSerif-Italic.ttf") format("truetype"); }

.cv {
  position: relative; overflow: hidden;
  width: 210mm; min-height: 297mm;
  background: #fff; color: #2b3440;
  font-family: "CV Sans", Arial, sans-serif; font-size: 9pt; line-height: 1.3;
  box-shadow: var(--sheet-shadow, 0 1mm 3mm rgba(0,0,0,.18));
  -webkit-font-smoothing: antialiased;
  display: flex; flex-direction: column;
}
.cv .f { white-space: pre-wrap; overflow-wrap: anywhere; min-width: 2mm; }
.cv .f:empty { min-height: 1.2em; }
.cv .b { font-weight: 700; }
.cv .muted { color: #5d6876; }
.cv ul { margin: 0; padding: 0; list-style: none; }
.page-guide {
  position: absolute; left: 0; right: 0; height: 0; z-index: 5; pointer-events: none;
  border-top: .35mm dashed rgba(47,107,255,.55);
}
.page-guide::after {
  content: attr(data-label); position: absolute; right: 3mm; top: .8mm;
  font: 600 2.6mm/1 system-ui, sans-serif; color: #2f6bff; background: rgba(255,255,255,.85); padding: .6mm 1.4mm; border-radius: 1mm;
}
.is-view .page-guide { border-top-color: rgba(0,0,0,.18); }
.is-view .page-guide::after { color: #8a93a3; }

/* tahrir rejimi: maydonlar, qator asboblari, qo'shish tugmalari */
.is-edit .f[contenteditable] { outline: none; border-radius: .5mm; cursor: text; transition: background-color .15s, box-shadow .15s; }
.is-edit .f[contenteditable]:hover { background: rgba(255, 205, 90, .18); }
.is-edit .f[contenteditable]:focus { background: rgba(47,107,255,.08); box-shadow: inset 0 -.3mm 0 #2f6bff; }
.is-edit .f[contenteditable]:empty::before { content: attr(data-hint); color: #a4a9b4; font-style: italic; font-weight: 400; letter-spacing: 0; text-transform: none; pointer-events: none; }
.row { position: relative; }
.rowtools {
  position: absolute; z-index: 6; right: 0; top: -5.4mm;
  display: flex; gap: .4mm; padding-bottom: .8mm;
  opacity: 0; pointer-events: none; transition: opacity .12s;
}
.row:hover > .rowtools, .row:focus-within > .rowtools { opacity: 1; pointer-events: auto; }
.tb {
  width: 4.8mm; height: 4.8mm; display: grid; place-items: center;
  border: 1px solid rgba(22,28,40,.12); border-radius: 1.2mm;
  background: #fff; color: #3b4352; font: 600 2.9mm/1 system-ui, sans-serif; cursor: pointer;
  box-shadow: 0 .4mm 1.2mm rgba(22,28,40,.2);
}
.tb:hover { background: #eef1f6; }
.tb.danger:hover { background: #fde8e5; color: #c0392b; }
.add-row {
  display: inline-flex; align-items: center; gap: 1.6mm; margin: 1mm 0 2mm;
  height: 6mm; padding: 0 2.8mm 0 1.8mm;
  border: .3mm dashed rgba(47,107,255,.55); border-radius: 1.6mm;
  background: rgba(47,107,255,.06); color: #2c5bd0; font: 600 2.9mm/1 system-ui, sans-serif; cursor: pointer;
}
.add-row .plus { width: 3.8mm; height: 3.8mm; border-radius: 50%; display: grid; place-items: center; background: #2f6bff; color: #fff; font-size: 3.2mm; }
.add-row:hover { background: rgba(47,107,255,.12); border-style: solid; }
.img-btn {
  position: absolute; z-index: 6; padding: 1.4mm 2.6mm; border: 0; border-radius: 1.6mm;
  background: rgba(15,23,42,.72); color: #fff; font: 600 2.8mm/1 system-ui, sans-serif; cursor: pointer;
  opacity: 0; transition: opacity .15s;
}
.u-hero:hover .img-btn, .m-photo:hover .img-btn { opacity: 1; }

/* ======================= 1. Organization ======================= */
.t-organization { --dark: #0f3b40; --acc: #1c6b6b; --tint: #e9f1ef; --line: #9cc2bd; }
.u-water { position: absolute; right: 0; bottom: 0; width: 80mm; height: 98mm; object-fit: cover; opacity: .9; pointer-events: none; }
.u-hero { position: relative; height: 50mm; flex: none; }
.u-hero-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.u-hero-img.ph { background: linear-gradient(135deg, #dfe9e7, #c9ddd9); }
.u-hero .img-btn { right: 4mm; bottom: 4mm; }
.u-hero-l { position: absolute; left: 12mm; top: 7mm; color: var(--dark); }
.u-org { font-weight: 700; font-size: 10pt; letter-spacing: .3em; text-transform: uppercase; }
.rule { display: block; width: 9mm; height: .55mm; background: var(--acc); margin: 2mm 0; }
.u-sub { font-size: 6.5pt; letter-spacing: .3em; text-transform: uppercase; }
.u-hero-r { position: absolute; right: 12mm; top: 5mm; width: 72mm; text-align: right; color: var(--dark); }
.u-hero-r .rule { margin-left: auto; }
.u-quote { font-family: "CV Serif", serif; font-style: italic; font-size: 13pt; line-height: 1.15; }
.u-id { display: grid; grid-template-columns: 1fr 60mm; gap: 6mm; padding: 6mm 10mm 6mm 12mm; position: relative; z-index: 1; }
.u-name { font-family: "CV Serif", serif; font-weight: 700; font-size: 28pt; line-height: 1; color: var(--dark); }
.u-title { font-size: 10pt; letter-spacing: .22em; text-transform: uppercase; color: var(--acc); margin-top: 2.5mm; line-height: 1.25; }
.u-org2 { font-size: 8.5pt; letter-spacing: .35em; text-transform: uppercase; color: var(--dark); margin-top: 3mm; }
.u-idr { border-left: .25mm solid var(--line); padding-left: 5mm; align-self: start; }
.u-motto { font-family: "CV Serif", serif; font-style: italic; font-size: 13pt; line-height: 1.15; color: var(--dark); }
.u-tag { font-size: 6.5pt; letter-spacing: .24em; text-transform: uppercase; color: var(--dark); line-height: 1.6; }
.u-body { flex: 1; display: grid; grid-template-columns: 70mm 1fr; position: relative; z-index: 1; }
.u-side { background: var(--tint); padding: 7mm 7mm 7mm 12mm; }
.u-main { padding: 7mm 12mm 7mm 8mm; }
.sec { margin-bottom: 4mm; }
.u-side .sec + .sec { border-top: .2mm solid var(--line); padding-top: 3.5mm; }
.sec-h { display: flex; align-items: center; gap: 2.4mm; margin-bottom: 2.8mm; }
.ic { display: inline-grid; place-items: center; flex: none; }
.ic svg { width: 100%; height: 100%; }
.ic-c { width: 7mm; height: 7mm; border-radius: 50%; background: var(--dark); color: #fff; padding: 1.5mm; }
.sec-h h3 { margin: 0; font-size: 9.5pt; letter-spacing: .18em; text-transform: uppercase; color: var(--dark); white-space: nowrap; }
.sec-h .ln { flex: 1; height: .28mm; background: transparent; }
.sec.m .sec-h .ln { background: var(--acc); }
.u-side .sec-h h3 { font-size: 8.8pt; letter-spacing: .1em; white-space: normal; line-height: 1.2; }
.c-row { display: grid; grid-template-columns: 3.6mm 1fr; gap: 2.4mm; align-items: start; margin-bottom: 1.7mm; font-size: 8.5pt; }
.ic-s { width: 3.6mm; height: 3.6mm; color: var(--dark); margin-top: .2mm; }
.u-edu { border-left: .25mm solid var(--line); margin-left: 3.4mm; padding-left: 6mm; }
.edu, .deg { margin-bottom: 2.8mm; font-size: 8.5pt; }
.edu .b, .deg .b { font-size: 9pt; color: #1c2230; }
.u-side .deg, .u-langs { margin-left: 9.4mm; }
.lang { display: flex; gap: 1.8mm; font-size: 9pt; margin-bottom: 1mm; }
.dash { color: #5d6876; }
.sum { font-size: 9pt; line-height: 1.4; padding-left: 5.4mm; }
.tl { position: relative; }
.tl-row { display: grid; grid-template-columns: 22mm 4mm 1fr; margin-bottom: 3.4mm; }
.tl-row::before { content: ""; position: absolute; left: 22mm; top: 0; bottom: -3.4mm; width: .28mm; background: var(--acc); }
.tl-row:last-of-type::before { bottom: 0; }
.tl-date { font-family: "CV Serif", serif; font-weight: 700; font-size: 8.2pt; color: var(--dark); padding-top: .4mm; }
.tl-dot { position: relative; }
.tl-dot::after { content: ""; position: absolute; left: -1mm; top: 1mm; width: 2.2mm; height: 2.2mm; border-radius: 50%; background: var(--dark); }
.tl-role { font-weight: 700; font-size: 9.2pt; color: var(--dark); }
.tl-org { font-size: 8.8pt; color: var(--acc); margin: .3mm 0 .8mm; }
.bul li { position: relative; padding-left: 3.4mm; font-size: 8pt; line-height: 1.35; }
.bul li::before { content: ""; position: absolute; left: .6mm; top: 1.5mm; width: 1.2mm; height: 1.2mm; border-radius: 50%; background: var(--dark, #333); }
.u-skills { columns: 2; column-gap: 5mm; padding-left: 1mm; }
.u-skills li { position: relative; padding-left: 3.4mm; font-size: 8.6pt; margin-bottom: 1mm; break-inside: avoid; }
.u-skills li::before { content: ""; position: absolute; left: .4mm; top: 1.45mm; width: 1.3mm; height: 1.3mm; border-radius: 50%; background: var(--dark); }
.u-bottom { display: grid; grid-template-columns: 70mm 1fr; align-items: end; position: relative; z-index: 1; padding-bottom: 6mm; }
.u-quote2 { padding: 4mm 7mm 0 12mm; font-family: "CV Serif", serif; font-style: italic; font-size: 10.5pt; line-height: 1.3; color: var(--dark); }
.u-foot { padding: 0 10mm 0 8mm; font-size: 6.8pt; letter-spacing: .28em; text-transform: uppercase; color: var(--dark); }

/* ======================= 2. Klassik ======================= */
.t-classic { --acc: #1d3557; --dark: #1d3557; font-family: "CV Serif", serif; font-size: 9.5pt; color: #222831; padding: 16mm 18mm; }
.c-head { text-align: center; }
.c-name { font-weight: 700; font-size: 26pt; color: #111; line-height: 1.05; }
.c-title { font-style: italic; font-size: 12pt; color: var(--acc); margin-top: 1.4mm; }
.c-org { font-family: "CV Sans", sans-serif; font-size: 8.5pt; letter-spacing: .26em; text-transform: uppercase; color: #5b6472; margin-top: 1.4mm; }
.c-contact { display: flex; flex-wrap: wrap; justify-content: center; gap: 1mm 3mm; margin-top: 2.8mm; font-size: 8.5pt; }
.c-sep { color: #9aa1ab; }
.c-sec { margin-top: 4.4mm; }
.c-sec h3 { margin: 0 0 2.2mm; padding-bottom: 1mm; border-bottom: .2mm solid #c9ced6; font-size: 10.5pt; letter-spacing: .2em; text-transform: uppercase; color: var(--acc); }
.t-classic .sum { padding: 0; text-align: justify; font-size: 9.5pt; line-height: 1.35; }
.c-job { margin-bottom: 3mm; }
.c-line { display: flex; justify-content: space-between; gap: 4mm; font-size: 10pt; }
.c-date { color: #5b6472; font-size: 9pt; white-space: nowrap; }
.c-it { font-style: italic; color: #5b6472; font-size: 9.2pt; margin: .3mm 0 .8mm; }
.t-classic .bul li { font-size: 9pt; }
.c-two { display: grid; grid-template-columns: 1fr 1fr; gap: 6mm; }
.c-mini { margin-bottom: 1.4mm; font-size: 9.2pt; }
.c-langs { display: flex; flex-wrap: wrap; gap: 1mm 6mm; }
.c-lang { display: flex; font-size: 9.2pt; }
.c-skills { columns: 2; column-gap: 6mm; }
.c-skills li { position: relative; padding-left: 3.4mm; font-size: 9pt; margin-bottom: .8mm; break-inside: avoid; }
.c-skills li::before { content: "•"; position: absolute; left: .6mm; color: var(--acc); }
.c-quote { margin: 6mm 12mm 0; text-align: center; font-style: italic; font-size: 10.5pt; color: var(--acc); }

/* ======================= 3. Zamonaviy ======================= */
.t-modern { --side: #1f3b4d; --gold: #c8923d; --dark: #1f3b4d; flex-direction: row; background: linear-gradient(90deg, var(--side) 0 66mm, #fff 66mm); }
.m-side { width: 66mm; flex: none; padding: 12mm 8mm; color: #fff; }
.m-photo { position: relative; width: 40mm; height: 40mm; margin: 0 auto 2mm; border-radius: 50%; overflow: hidden; background: #2f5268; }
.m-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.m-ini { width: 100%; height: 100%; display: grid; place-items: center; font-size: 26pt; font-weight: 700; color: #fff; }
.m-photo .img-btn { left: 50%; bottom: 3mm; transform: translateX(-50%); white-space: nowrap; }
.m-ss h3 { margin: 5mm 0 2.2mm; font-size: 8.8pt; letter-spacing: .18em; text-transform: uppercase; color: var(--gold); }
.m-c { font-size: 8.3pt; color: #fff; }
.m-c .ic-s { color: var(--gold); }
.m-lang { margin-bottom: 1.8mm; font-size: 9pt; }
.m-lv { font-size: 8.3pt; color: #dbe4ea; }
.m-chips { display: flex; flex-direction: column; gap: 1.2mm; }
.m-chip { font-size: 8.3pt; }
.m-quote { margin-top: 6mm; font-family: "CV Serif", serif; font-style: italic; font-size: 10pt; color: #dbe4ea; }
.t-modern .add-row { background: rgba(255,255,255,.1); color: #d7e5ff; border-color: rgba(215,229,255,.5); }
.m-main { flex: 1; padding: 12mm 12mm 12mm 10mm; }
.m-name { font-weight: 700; font-size: 25pt; line-height: 1; color: var(--side); }
.m-title { font-weight: 700; font-size: 9.5pt; letter-spacing: .15em; text-transform: uppercase; color: var(--gold); margin-top: 2.4mm; }
.m-org { font-size: 9.5pt; color: #66717f; margin-top: 1mm; }
.m-sec { margin-top: 4.4mm; }
.m-h { display: flex; align-items: center; gap: 2mm; margin-bottom: 2.2mm; }
.ic-m { width: 4.6mm; height: 4.6mm; color: var(--gold); }
.m-h h3 { margin: 0; font-size: 10pt; letter-spacing: .16em; text-transform: uppercase; color: var(--side); }
.t-modern .sum { padding: 0; font-size: 9pt; line-height: 1.4; }
.m-job { margin-bottom: 2.8mm; }
.m-line { display: flex; justify-content: space-between; gap: 4mm; font-size: 9.6pt; color: var(--side); }
.m-date { color: var(--gold); font-weight: 700; font-size: 8.6pt; white-space: nowrap; }
.m-org2 { font-size: 8.8pt; color: #66717f; margin: .3mm 0 .8mm; }
.t-modern .bul li::before { background: var(--gold); }