/* ============================================================
   Sof tilim — Lingvistik tahlil
   ============================================================ */

/* Yon menyu yig'ilgani uchun ish maydoni to'liq kenglikni oladi:
   asosiy e'tibor loyiha matni kiritiladigan maydonga qaratiladi. */
.st-work__body--ekspert { max-width: none; padding: 22px 28px 60px; }

.st-ekspert { margin-top: 20px; }

/* ---------- Tizim qanday ishlaydi ---------------------------- */

.st-qadamlar {
  margin-top: 18px; display: grid; gap: 12px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.st-qadam {
  background: var(--st-panel); border: 1px solid var(--st-line);
  border-radius: 16px; padding: 18px 20px;
}
.st-qadam > b {
  display: inline-flex; align-items: center; justify-content: center;
  width: 26px; height: 26px; border-radius: 50%;
  background: var(--st-bg-tint); color: var(--st-blue);
  font-size: 13px; font-weight: 700;
}
.st-qadam h3 { margin-top: 11px; font-size: 15.5px; color: var(--st-navy); }
.st-qadam p { margin: 7px 0 0; font-size: 14.2px; color: var(--st-ink-soft); line-height: 1.55; }

/* Keng ekranda uch qadam bitta ixcham lentaga siqiladi — matn
   maydoni yuqoriroqqa chiqadi. */
@media (min-width: 1100px) {
  .st-work__body--ekspert .st-qadam {
    display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap;
    padding: 12px 16px;
  }
  .st-work__body--ekspert .st-qadam > b { width: 22px; height: 22px; font-size: 12px; }
  .st-work__body--ekspert .st-qadam h3 { margin-top: 0; font-size: 14.5px; }
  .st-work__body--ekspert .st-qadam p {
    margin: 0; flex: 1 1 100%; font-size: 13.4px; line-height: 1.5;
  }
}

/* ---------- Loyiha ma'lumotlari ------------------------------- */

.st-maydonlar {
  margin-top: 18px; display: grid; gap: 12px;
  grid-template-columns: 150px minmax(0, 1fr);
}
/* Keng ekranda raqam, tur va nom bitta qatorga joylashadi */
@media (min-width: 1100px) {
  .st-work__body--ekspert .st-maydonlar {
    grid-template-columns: 150px 300px minmax(0, 1fr);
  }
  .st-work__body--ekspert .st-maydonlar > .st-maydon--keng:nth-child(3) {
    grid-column: auto;
  }
  /* Loyiha matni — kengaygan maydonda balandroq */
  .st-work__body--ekspert .st-quti textarea { min-height: 400px; }
}
.st-maydon--keng { grid-column: 1 / -1; }
.st-maydon label {
  display: block; font-size: 11.5px; font-weight: 700; letter-spacing: .1em;
  text-transform: uppercase; color: var(--st-muted); margin-bottom: 6px;
}
.st-maydon select, .st-maydon input {
  width: 100%; padding: 12px 14px; border-radius: 12px;
  border: 1px solid var(--st-line); background: #fff;
  font: 400 15px/1.3 var(--st-font); color: var(--st-ink);
}
.st-maydon select:focus, .st-maydon input:focus {
  outline: 0; border-color: var(--st-blue);
  box-shadow: 0 0 0 3px rgba(11, 87, 208, .14);
}

/* ---------- Ishga tushirish ----------------------------------- */

.st-boshla {
  margin-top: 16px; display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
}
.st-boshla__tugma {
  padding: 14px 26px; border-radius: 13px; border: 0;
  background: var(--st-blue); color: #fff; cursor: pointer;
  font: 700 15.5px/1 var(--st-font);
  box-shadow: 0 6px 18px rgba(11, 87, 208, .22);
}
.st-boshla__tugma:hover:not(:disabled) { background: #0a4cb8; }
.st-boshla__tugma:disabled { opacity: .45; cursor: not-allowed; box-shadow: none; }

/* ---------- Xulosa -------------------------------------------- */

.st-xulosa { margin-top: 30px; display: none; }
.st-xulosa.is-open { display: block; }

/* A4 varaq */
.st-varaq-quti { overflow-x: auto; padding: 2px; }

.st-a4 {
  position: relative;
  width: 210mm; min-height: 297mm; margin: 0 auto;
  background: #fff; border: 1px solid var(--st-line);
  box-shadow: 0 10px 34px rgba(2, 20, 50, .13);
  padding: 20mm 15mm 20mm 30mm;
  font-family: "Times New Roman", Times, serif;
  font-size: 14pt; line-height: 1.1; color: #000;
  box-sizing: border-box;
  overflow-wrap: anywhere;   /* uzun uzluksiz so'z varaqdan chiqib ketmasin */
  -webkit-print-color-adjust: exact; print-color-adjust: exact;
}

/* Logotip */
.a4-logo {
  display: block; height: 16mm; width: auto; margin: 0 auto 6mm;
}

/* Ogohlantirish — Times New Roman 12pt, jirniy, qizil */
.a4-ogoh {
  font-family: "Times New Roman", Times, serif;
  font-size: 12pt; font-weight: 700; color: #B3261E;
  text-align: justify; text-indent: 0; line-height: 1.3;
  margin: 0 0 6mm; padding: 3mm 4mm;
  border: 1pt solid #B3261E;
}

.a4-bosh { text-align: center; }
.a4-bosh h2 {
  font-family: inherit; font-size: 13pt; font-weight: 700;
  line-height: 1.2; letter-spacing: 0; color: #000; text-transform: none;
}
.a4-son { margin-top: 5mm; text-align: right; font-size: 12pt; text-indent: 0; }

/* Kompakt meta-blok — turi, nomi, o'tkazuvchi, sana */
.a4-meta {
  margin: 6mm 0 0; padding: 0; font-size: 11pt; line-height: 1.4;
}
.a4-meta > div { display: flex; gap: 2mm; margin: 0.8mm 0; }
.a4-meta dt { flex: 0 0 auto; font-weight: 400; }
.a4-meta dd { margin: 0; font-weight: 700; }

/* Xulosa qismlari */
.a4-qism { margin-top: 6mm; page-break-inside: avoid; }
.a4-qism__nom {
  font-family: inherit; font-size: 11.5pt; font-weight: 700;
  margin: 0 0 2mm; text-indent: 0;
}
.a4-qism__izoh { font-weight: 400; font-style: italic; }

.a4-yoq { margin-top: 2mm; text-align: justify; text-indent: 0; }

/* Xulosaning 1-qismi — avval kamchiliklar soni, so'ng qisqa jadval */
.a4-jadval { margin-top: 2mm; overflow-x: auto; }

/* Kamchiliklar soni — ILOVAdagi belgilash ranglari kesimida */
.a4-sanoq {
  width: 100%; border-collapse: collapse;
  font-size: 10.5pt; line-height: 1.4; page-break-inside: avoid;
}
.a4-sanoq td {
  border: 0.4pt solid #000; padding: 1.6mm 2mm; text-align: left;
}
.a4-sanoq td:last-child {
  width: 26mm; text-align: right; white-space: nowrap; font-weight: 700;
}
.a4-sanoq__jami td { font-weight: 700; background: #F2F2F2; }
.a4-sanoq__izoh {
  margin-top: 2.5mm; font-size: 10.5pt; text-indent: 0; text-align: justify;
}

/* Umumiy lingvistik holat */
.a4-baho { margin-top: 2mm; }
.a4-baho__satr { margin-top: 1.5mm; text-align: justify; text-indent: 0; }
/* Kirish yoki to'lov chaqirig'i — ekranda ko'rinadi, chop etishda emas */
.a4-baho__chaqiruv {
  margin-top: 3mm; padding: 3mm 4mm; border-radius: 10px;
  background: var(--st-bg-tint); color: var(--st-ink-soft);
  font-size: 10.5pt; line-height: 1.55; text-align: left;
}
.a4-baho__chaqiruv .st-btn { margin-top: 2mm; }
/* Sarflangan tokenlar — faqat ekranda */
.a4-baho__sarf { margin-top: 2mm; font-size: 9pt; color: var(--st-muted); }

.a4-izoh {
  margin-top: 6mm; font-size: 10.5pt; line-height: 1.2;
  text-align: justify; text-indent: 0;
}
.a4-izoh--ai { font-style: italic; color: #444; }

/* 3-qism — tizim topgan kamchiliklar. Bitta qisqa jumla; bahoga ham,
   ILOVAdagi belgilashga ham kirmaydi, shuning uchun ko'zga tashlanmaydi. */
.a4-tizim {
  margin-top: 2mm; text-align: justify; text-indent: 0;
  color: #444;
}
.a4-qism--tizim[hidden] { display: none; }

/* ---------- ILOVA: aniqlangan kamchiliklar ko'chirmasi -------- */

.a4-ilova { margin-top: 8mm; page-break-before: always; break-before: page; }
.a4-ilova__nom {
  font-family: inherit; font-size: 12pt; font-weight: 700;
  text-align: center; line-height: 1.3; margin: 0 0 4mm;
}
.a4-rang-izoh {
  font-size: 10pt; line-height: 1.45; margin-bottom: 4mm;
  padding: 2.5mm 3.5mm; border: 0.4pt solid #000;
}
.a4-rang-izoh p { margin: 0.8mm 0; text-indent: 0; text-align: left; }

/* Kiritilgan matn to'liq ko'chiriladi; kamchilik so'zlari belgilanadi */
.a4-asl { text-indent: 0; }
.a4-asl__matn {
  font-size: 11.5pt; line-height: 1.6;
  text-align: justify; text-indent: 0; word-break: break-word;
}
/* BELGILASH — FAQAT TAGIDAGI CHIZIQ RANGLI
   Matnning o'zi hamma joyda qora qoladi: rasmiy hujjatda rangli harf
   ham, fon bo'yog'i ham o'rinsiz — hujjat rangli varaqqa o'xshab
   qoladi va o'qish qiyinlashadi. Kamchilik faqat SO'Z OSTIDAGI rangli
   chiziq bilan ko'rsatiladi. Shu sababli <u> ning o'z chizig'i olib
   tashlanadi (u qora bo'lardi), chiziq esa `border-bottom` orqali
   aniq rang bilan beriladi. Qoida belgilash SPANiga bog'lanadi, ILOVA
   maydoniga emas: ayni shu belgilar xulosadagi «Belgilar sharhi» va
   sanoq jadvalida ham namuna sifatida ishlatiladi — u yerda ham chiziq
   bitta va rangli bo'lishi kerak. */
.mk-imlo u, .mk-boshqa u, .mk-atama u { text-decoration: none; }

/* Belgilash ranglari — ekranda ham, PDFda ham bir xil.
   Rang faqat chiziqda: `color` qo'yilmaydi, harflar qora qoladi. */
.mk-imlo   { border-bottom: 2px solid #B02418; }   /* to'q qizil */
.mk-boshqa { border-bottom: 2px solid #D19A00; }   /* sariq */
.mk-atama  { border-bottom: 2px solid #6B3A1E; }   /* jigarrang */

/* Jumla darajasidagi kamchilik — butun jumla ostiga nuqtali chiziq.
   Ingichka va uzuq: uzun jumla ostidagi yaxlit qalin chiziq ichkaridagi
   so'z belgilarini bosib ketardi. */
.mk--uzun {
  border-bottom-width: 1px;
  border-bottom-style: dashed;
}

/* Umumiy taalluqli — matn ichida belgilanmaydigan kamchiliklar */
/* Belgilash raqami — matn ichida, chiziqdan keyin. Kichik va ko'k:
   o'qishga xalal bermaydi, lekin ro'yxatdagi izohga ulab turadi. */
.mk-raqam {
  font-size: 7pt; font-weight: 700; line-height: 0;
  vertical-align: super; color: var(--st-navy);
  padding-left: 1px; text-decoration: none;
}

/* Belgilangan kamchiliklar izohi — raqam bo'yicha ro'yxat.
   Sariq chiziq o'z holicha «nega?» degan savol tug'dirardi; bu
   ro'yxat har bir belgilashga javob beradi. */
.a4-nomlar { margin-top: 5mm; font-size: 11pt; }
.a4-nomlar__nom { margin: 0 0 2mm; font-weight: 700; text-indent: 0; }
.a4-nomlar__ro { margin: 0; padding-left: 7mm; }
.a4-nomlar__ro li {
  margin-top: 1.2mm; text-indent: 0; text-align: left;
  page-break-inside: avoid;
}

.a4-umumiy { margin: 14px 0 0; font-size: 11pt; }
.a4-umumiy__nom { margin: 0 0 4px; font-weight: 600; }
.a4-umumiy ul { margin: 0; padding-left: 18px; }

/* Yuklab olish */
.st-yuklab { margin-top: 20px; display: flex; gap: 10px; flex-wrap: wrap; }
.st-yordam { margin: 10px 0 0; font-size: 13.4px; color: var(--st-muted); }
.st-yordam b { color: var(--st-ink); }

/* ---------- Ekrandagi qo'shimcha ma'lumot --------------------- */

.st-bolim { margin-top: 30px; }
.st-bolim h3 {
  font-size: 12.5px; letter-spacing: .12em; text-transform: uppercase;
  color: var(--st-navy); font-weight: 700;
  padding-bottom: 9px; border-bottom: 1px solid var(--st-line);
}
.st-bolim p.matn { margin: 16px 0 0; font-size: 15.4px; line-height: 1.72; color: var(--st-ink); }

.st-raqamlar {
  margin-top: 18px; display: grid; gap: 10px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.st-raqam {
  border: 1px solid var(--st-line); border-radius: 13px;
  padding: 14px 16px; background: #FBFCFE;
}
.st-raqam b {
  display: block; font-size: 24px; color: var(--st-navy);
  font-variant-numeric: tabular-nums; letter-spacing: -.02em;
}
.st-raqam span { display: block; margin-top: 3px; font-size: 12.4px; color: var(--st-muted); }
.st-raqam--ogoh b { color: #B3261E; }
.st-raqam--yaxshi b { color: #0A6C2E; }

/* ---------- Kutish holati ------------------------------------- */

.st-kutish { display: none; padding: 40px 0; text-align: center; }
.st-kutish.is-open { display: block; }
.st-kutish p { margin: 14px 0 0; color: var(--st-muted); font-size: 14.6px; }
.st-kutish__izoh { font-size: 13.2px !important; opacity: .75; }

/* ---------- Nosozlik ------------------------------------------
   Sun'iy intellekt tahlili o'tmagan holat. Xulosa o'rniga shu blok
   chiqadi: qoidalar bazasi natijasini rasmiy xulosa deb berish
   tizim nufuziga putur yetkazadi.
   --------------------------------------------------------------- */

.st-nosoz {
  display: none; margin-top: 26px;
  padding: 20px 22px; border-radius: 14px;
  border: 1px solid #F3D2CE; background: #FDF3F2;
}
.st-nosoz.is-open { display: block; }
.st-nosoz__bosh {
  margin: 0; color: #7E241D; font-weight: 700; font-size: 16px; line-height: 1.5;
}
.st-nosoz__matn {
  margin: 8px 0 0; color: #9F2F26; font-size: 14.6px; line-height: 1.6;
  max-width: 62ch;
}
.st-nosoz__amal:not(:empty) { margin-top: 16px; }

/* ---------- Mobil --------------------------------------------- */

@media (max-width: 900px) {
  .st-qadamlar { grid-template-columns: 1fr; }
  .st-maydonlar { grid-template-columns: 1fr; }
  /* Telefonda chetki bo'shliq umumiy qobiqdagidek qoladi */
  .st-work__body--ekspert { padding: 24px 16px 60px; }
  .st-raqamlar { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .st-a4 {
    width: 100%; min-height: 0;
    padding: 22px 18px; font-size: 15px; box-shadow: var(--st-shadow-1);
  }
  .st-a4 .a4-bosh h2 { font-size: 15px; }
  .a4-son { margin-top: 12px; font-size: 14px; }
  .a4-meta { margin-top: 14px; font-size: 13px; }
  .a4-qism { margin-top: 16px; }
  .a4-izoh { font-size: 12px; margin-top: 16px; }
  .a4-logo { height: 40px; }
  .a4-ogoh { font-size: 12.5px; padding: 12px 14px; }
  .a4-ilova { page-break-before: auto; margin-top: 20px; }
  .a4-asl__matn { font-size: 13.5px; }
}

/* ---------- Chop etish / PDF ---------------------------------- */

@media print {
  .st-side, .st-work__bar, .st-veil, .st-yuklab, .st-yordam,
  .st-ekspert__kirit, .st-qadamlar, .st-h1, .st-sub,
  .st-qoshimcha, .st-kutish, .st-nosoz, .st-modal { display: none !important; }

  .st-app { display: block; }
  .st-work__body { padding: 0; max-width: none; }
  .st-varaq-quti { overflow: visible; padding: 0; }
  body { background: #fff; }

  .st-a4 {
    width: auto; min-height: 0; margin: 0; padding: 0;
    border: 0; box-shadow: none;
  }

  /* Jadval sahifalar orasida uzilmasin, sarlavha takrorlansin */
  .a4-asl { page-break-inside: auto; }
  .a4-baho { page-break-inside: avoid; }
  .a4-baho__chaqiruv, .a4-baho__sarf { display: none !important; }

  /* Hoshiya 8mm da — matn undan ichkarida boshlansin */
  @page { size: A4 portrait; margin: 18mm 16mm 18mm 22mm; }
}

/* ---------- Kirill yozuvi ogohlantirishi ---------------------- */

.st-yozuv {
  margin-top: 14px; display: none;
  align-items: center; gap: 14px; flex-wrap: wrap;
  padding: 13px 16px; border-radius: 12px;
  border: 1px solid #F3D2CE; background: #FDF3F2; color: #9F2F26;
  font-size: 14px; line-height: 1.55;
}
.st-yozuv.is-open { display: flex; }
.st-yozuv__matn { flex: 1 1 320px; min-width: 0; }
.st-yozuv__matn b { color: #7E241D; }

@media (max-width: 560px) {
  .st-yozuv button { width: 100%; }
}
