/* ═══════════════════════════════════════════════════════════════
   YaqinJoy — TELEVIZOR / JUDA KATTA EKRAN QATLAMI (v114)

   QOIDA: bu faylning HAMMASI `@media (min-width: 2560px)` ichida.
   Telefon (390–767px), planshet (768–1023px) va oddiy kompyuter
   (1024–2559px) ko'rinishiga bir piksel ham tegmaydi.
   Muammo chiqsa index.html dagi bitta qatorni o'chirish kifoya.

   ─── MUAMMO ────────────────────────────────────────────────────
   Kompyuter qatlami kontentni 1260px da qulflaydi va undan keyin
   faqat chetdagi bo'sh joy o'sadi. Bu 24"–27" monitor uchun to'g'ri
   qaror: o'qish ustuni qancha keng bo'lsa, ko'z shuncha charchaydi.

   Lekin TELEVIZORDA bu qaror teskari ishlaydi:
     · 4K televizor (3840px) da sayt ekranning atigi 35% ini
       egallardi — chapda 1375px bo'sh kulrang maydon turardi
     · matn 15.5px da qolardi — 3 metr masofadan o'qib bo'lmaydi

   ─── YECHIM ────────────────────────────────────────────────────
   Ega shunday dedi: "televizor uchun kompyuterday ko'rinish",
   "alohida dizayn qilish emas — kattalashtirilsa bo'ldi".

   Shuning uchun bu yerda YANGI MAKET YO'Q. O'sha chap yon panel,
   o'sha ustunlar to'ri, o'sha ikki ustunli biznes sahifasi —
   faqat brauzer hammasini `--kt` marta kattaroq chizadi.

   ─── NEGA "BARMOQ/PULT" SHARTI BOR (v118) ──────────────────────
   Faqat ENGA qarab qaror qilish yetarli emas: kompyuterda brauzer
   masshtabi o'zgarsa (masalan 150%), oyna eni ham o'zgaradi va sayt
   uni boshqa qurilma deb o'ylab, ustidan yana kattalashtirib
   yuborardi. Shuning uchun `hover: none` sharti qo'shildi —
   televizor (pult) va planshet (barmoq) shu shartga tushadi,
   sichqonchali kompyuter esa tushmaydi.

   Agar televizor brauzeri `hover` ni boshqacha bildirsa, u oddiy
   kompyuter ko'rinishini oladi — ya'ni bugungi holat. Hech narsa
   buzilmaydi.

   ─── NEGA 2560px DAN BOSHLANADI ────────────────────────────────
   1920×1080 — dunyodagi eng keng tarqalgan KOMPYUTER ekrani.
   Uni kattalashtirish oddiy foydalanuvchini bezovta qilardi, va
   1920px li televizor allaqachon to'liq "kompyuterday" ko'rinadi.
   Shuning uchun kattalashtirish faqat haqiqatan ham ulkan
   maydonlardan boshlanadi:

     2560px+  →  1.25   (2K televizor / juda katta monitor)
     3840px+  →  2.40   (4K televizor)

   `zoom` haqidagi izohlar — `planshet.css` ning boshida (nega
   `zoom`, xarita bilan nima muammo, `100dvh` nega bo'linadi).
   ═══════════════════════════════════════════════════════════════ */

/* Ekran koeffitsienti × foydalanuvchi tanlagan matn kattaligi
   (`--ts`, kattalik.css). Ikkalasi BIRGA ishlaydi. */
@media (min-width: 2560px) and (hover: none) { :root { --kt: calc(1.25 * var(--ts)); } }
@media (min-width: 3840px) and (hover: none) { :root { --kt: calc(2.4 * var(--ts)); } }

@media (min-width: 2560px) and (hover: none) {

  /* ═══ 1. KATTALASHTIRISH ════════════════════════════════════
     Tayyor foiz — `calc()` ham, `var()` ham yo'q. Sababi
     `planshet.css` boshida yozilgan (eski Safari `zoom` da `calc()`
     ni rad etishi mumkin). 1.25 × matn kattaligi. */
  body:not(.map-mode) { zoom: 125%; --zoom-want: 1.25; }
  html[data-tsize="2"] body:not(.map-mode) { zoom: 143.75%; --zoom-want: 1.4375; }
  html[data-tsize="3"] body:not(.map-mode) { zoom: 162.5%; --zoom-want: 1.625; }

  body:not(.map-mode) #app,
  body:not(.map-mode) #app > .page,
  body:not(.map-mode) .page,
  body:not(.map-mode) .wiz-page,
  body:not(.map-mode) .cab-app,
  body:not(.map-mode) .adm-app { min-height: calc(100dvh / var(--kt)); }
  body:not(.map-mode) .bottom-nav { min-height: calc(100dvh / var(--kt)); }
  body:not(.map-mode) .adm-side { height: calc(100dvh / var(--kt)); }
  body:not(.map-mode) #toast-wrap { width: min(calc(92vw / var(--kt)), 480px); }
  body:not(.cab-mode):not(.adm-mode):not(.map-mode) .sheet {
    width: min(520px, calc(60vw / var(--kt))); }
  body:not(.map-mode) .sheet-scroll,
  body:not(.map-mode) .hrs-box { max-height: calc(60vh / var(--kt)); }

  /* Ekran ulkan — o'qish maydoni ham bir oz kengayadi. Lekin
     cheklov saqlanadi: 3 metrdan qaraganda ham ko'z bitta qatorni
     boshidan oxirigacha kuzata olishi kerak. */
  :root { --desk-max: 1420px; }
}
@media (min-width: 3840px) and (hover: none) {
  :root { --desk-max: 1300px; }
}

/* ═══ 2. XARITA — zoom'siz, qo'lda kattalashtiriladi ════════════
   Xarita sahifasida zoom o'chirilgan (Leaflet o'lchovni ikki xil
   usulda o'qiydi — planshet.css boshidagi izohga qarang), shuning
   uchun uning ustidagi boshqaruv elementlari bittalab
   kattalashtiriladi. */
@media (min-width: 2560px) and (hover: none) {
  .map-mode .map-ui-top,
  .map-mode .map-ui-top.slim { padding: calc(18px * var(--kt)) calc(20px * var(--kt))
    calc(12px * var(--kt)); }
  .map-mode .map-search { max-width: calc(480px * var(--kt));
    padding: calc(9px * var(--kt)) calc(6px * var(--kt))
             calc(9px * var(--kt)) calc(16px * var(--kt)); }
  .map-mode .map-search input { font-size: calc(14.5px * var(--kt)); }
  .map-mode .map-filter-inline { width: calc(36px * var(--kt)); height: calc(36px * var(--kt)); }
  .map-mode .chip { padding: calc(6px * var(--kt)) calc(13px * var(--kt));
    font-size: calc(12.5px * var(--kt)); gap: calc(5px * var(--kt)); }
  .map-mode .icon-btn { width: calc(36px * var(--kt)); height: calc(36px * var(--kt)); }
  .map-mode .ic { width: calc(22px * var(--kt)); height: calc(22px * var(--kt)); }
  .map-mode .ic-sm { width: calc(17px * var(--kt)); height: calc(17px * var(--kt)); }
  .map-mode .search-area-btn { top: calc(132px * var(--kt)); font-size: calc(12.5px * var(--kt));
    padding: calc(9px * var(--kt)) calc(16px * var(--kt)); }
  .map-mode .uz-total { top: calc(176px * var(--kt)); font-size: calc(11px * var(--kt)); }
  .map-mode .map-fabs .icon-btn { width: calc(36px * var(--kt)); height: calc(36px * var(--kt)); }
  .map-mode .sheet-head { height: calc(46px * var(--kt)); }
  .map-mode .sheet-title { font-size: calc(12.5px * var(--kt)); }
  .map-mode .sheet-title b { font-size: calc(13.5px * var(--kt)); }
  .map-mode .map-sheet .pop-card { width: calc(200px * var(--kt));
    border-radius: calc(15px * var(--kt)); }
  .map-mode .map-sheet .pop-img { height: calc(116px * var(--kt)); }
  .map-mode .pop-body { padding: calc(8px * var(--kt)) calc(10px * var(--kt)) calc(10px * var(--kt)); }
  .map-mode .pop-body .bc-name { font-size: calc(14.5px * var(--kt)) !important; }
  .map-mode .pop-logo { width: calc(30px * var(--kt)); height: calc(30px * var(--kt));
    font-size: calc(9.5px * var(--kt)); }
  .map-mode .pop-heart { width: calc(26px * var(--kt)); height: calc(26px * var(--kt)); }
  .map-mode .pop-hours, .map-mode .pop-status { font-size: calc(11px * var(--kt)); }
  .map-mode .picked-card, .map-mode .route-card {
    width: min(calc(560px * var(--kt)), 56vw); padding: calc(10px * var(--kt)) calc(12px * var(--kt)); }
  .map-mode .picked-card b, .map-mode .picked-card span { font-size: calc(13px * var(--kt)); }

  /* Chap yon panel xarita sahifasida ham kattalashadi (u yerda
     `zoom` o'chirilgan, shuning uchun alohida yozilyapti). */
  .map-mode .bottom-nav { padding: calc(20px * var(--kt)) calc(14px * var(--kt)) calc(16px * var(--kt)); }
  .map-mode .bottom-nav::after { height: calc(42px * var(--kt));
    margin: 0 calc(6px * var(--kt)) calc(20px * var(--kt));
    padding-left: calc(40px * var(--kt)); font-size: calc(18.5px * var(--kt));
    background-size: calc(28px * var(--kt)) calc(28px * var(--kt)); }
  .map-mode .bottom-nav .bn-item,
  .map-mode .bottom-nav .bn-center,
  .map-mode .bn5 .bn-center { gap: calc(12px * var(--kt)); height: calc(44px * var(--kt));
    padding: 0 calc(12px * var(--kt)); border-radius: calc(10px * var(--kt));
    font-size: calc(14.5px * var(--kt)); }
  .map-mode .bottom-nav .bn-item svg,
  .map-mode .bottom-nav .bn-center svg,
  .map-mode .bn5 .bn-center .bn-fab svg { width: calc(20px * var(--kt)); height: calc(20px * var(--kt)); }
  .map-mode .bn5 .bn-center .bn-lbl { font-size: calc(14.5px * var(--kt)); }
  .map-mode .bn-desk .bn-sub { height: calc(36px * var(--kt)); padding: 0 calc(12px * var(--kt));
    font-size: calc(13.5px * var(--kt)); }
  .map-mode .bn-desk .bn-sub svg { width: calc(17px * var(--kt)); height: calc(17px * var(--kt)); }
  .map-mode .bn-lang button { height: calc(28px * var(--kt)); font-size: calc(12px * var(--kt)); }
  :root { --side-w: 250px; }
  .map-mode { --side-w: calc(250px * var(--kt)); }

  /* Karusel kartasidagi mayda yozuvlar ham qolib ketmasin */
  .map-mode .pop-name, .map-mode .pop-meta,
  .map-mode .pop-body .stars, .map-mode .pop-body .muted { font-size: calc(12px * var(--kt)); }
  .map-mode .pop-body div, .map-mode .pop-body span { font-size: calc(11.5px * var(--kt)); }
  /* DIQQAT: bu uchta o'lcham HTML ichida (`style="font-size:..."`)
     yozilgan — oddiy CSS qoidasi ularni bosa olmaydi. Katta ekranda
     kartaning sarlavhasi kattayib, ostidagi masofa va reyting
     kichkina qolib ketmasligi uchun `!important` ishlatiladi. */
  .map-mode .pop-body .bc-name, .map-mode .pop-body .bc-name span {
    font-size: calc(14.5px * var(--kt)) !important; }
  .map-mode .pop-body .bc-meta { font-size: calc(12px * var(--kt)) !important; }
  .map-mode .pop-body .stars { font-size: calc(11.5px * var(--kt)) !important; }

  /* Xarita markerlari: Leaflet ularni `transform: translate3d` bilan
     joylashtiradi, shuning uchun ICHKI o'ram kattalashtiriladi.
     `transform-origin` aynan bog'lanish nuqtasida (50% 16px) —
     shunda marker o'z joyidan surilmaydi. */
  .map-mode .bm-wrap { transform: translateY(-2px) scale(var(--kt));
    transform-origin: 50% 16px; }
}

/* ═══ 4K TELEVIZOR: 2.4 × matn kattaligi ════════════════════════ */
@media (min-width: 3840px) and (hover: none) {
  body:not(.map-mode) { zoom: 240%; --zoom-want: 2.4; }
  html[data-tsize="2"] body:not(.map-mode) { zoom: 276%; --zoom-want: 2.76; }
  html[data-tsize="3"] body:not(.map-mode) { zoom: 312%; --zoom-want: 3.12; }
}