/*
  O'YIN 1 — NOUTBUK/O'RTA EKRAN (masalan 1366x768) UCHUN HEADER TUZATISH
  =========================================================================
  MUAMMO: style.css'dagi "#pageOyin1 .pill-bar-fixed{ left:345px; right:215px; }"
  qoidasi FAQAT quyidagi ikki holat uchun moslashtirilgan edi:
    - max-width:768px  (telefon)   -> markazga qaytadi
    - min-width:3840px (4K monitor) -> maxsus ixcham fayl bor
  769px - 3839px oralig'idagi barcha ekranlar (aynan 1366x768 kabi eng
  keng tarqalgan noutbuk o'lchami shu oraliqda!) uchun hech qanday
  moslama yo'q edi — 345+215=560px band qilingani sababli, 7 ta
  sozlama chipi (Amal turi/Daraja/Osonlik/Xona/Qator/Vaqt/Ishtirokchilar)
  bitta qatorga TO'LIQ sig'may qolardi. ".pill-settings-bar"dagi
  "overflow-x:auto" + yashirilgan skroll-bar tufayli oxirgi chip
  ("BITTA" — ishtirokchilar soni) hech qanday belgisiz kesilib
  qolayotgan edi.

  YECHIM: shu oraliqdagi ekranlar uchun (a) chap/o'ng band qilingan
  joyni kamaytiradi, (b) chiplarni sal ixchamlaydi — natijada barcha
  7 ta chip bitta qatorda, kesilmasdan to'liq ko'rinadi.
  Boshqa sahifalar, telefon va 4K ko'rinishlarga ta'sir qilmaydi.
*/
@media (min-width:769px) and (max-width:1600px){
  #pageOyin1 .pill-bar-fixed{
    left:250px !important;
    right:150px !important;
  }

  #pageOyin1 .pill-settings-bar{
    gap:4px !important;
  }

  #pageOyin1 .pill-chip{
    height:32px !important;
    min-height:32px !important;
    padding:0 9px !important;
    gap:4px !important;
    font-size:0.66rem !important;
  }

  #pageOyin1 .pill-chip-icon{
    width:18px !important;
    height:18px !important;
    font-size:0.64rem !important;
  }

  #pageOyin1 .pill-step{
    width:20px !important;
    height:20px !important;
    font-size:0.72rem !important;
  }

  #pageOyin1 .pill-chip-input{
    font-size:0.66rem !important;
    width:1.9em !important;
    min-width:16px !important;
  }
}