/* ===== Ozon'dagidek bitta qator bo'limlar (tepada) ===== */
.qr-wrap { position: relative; max-width: 1200px; margin: 0 auto; }
.qr-row { padding: 0 16px 10px; display: flex; gap: 4px; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.qr-row::-webkit-scrollbar { display: none; }
.qr-i { flex: none; display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 12px; border: 0; border-radius: 999px; background: none;
    color: #cfd6de; font: inherit; font-size: 13.5px; white-space: nowrap; cursor: pointer; text-decoration: none; }
.qr-i:hover { background: rgba(255,255,255,.09); color: #fff; }
.qr-i .qr-e { font-size: 15px; filter: grayscale(.35); }
.qr-i.on { background: #fff; color: var(--ink, #17202a); font-weight: 700; }
.qr-i.on .qr-e { filter: none; }
.qr-sale { color: #ffb08a; font-weight: 700; }
.qr-sale.on { background: #ff5a1f; color: #fff; }
.qr-sell { margin-left: auto; color: #f5c56b; }
/* Bosh sahifada katta «Bo'limlar» bloki yo'q — faqat bo'lim tanlanganda ichki kategoriyalar chiqadi */
body:not(.grp-on) main.page > section:has(#groupTabs) { display: none; }
body.grp-on main.page > section:has(#groupTabs) .section-title, body.grp-on #groupTabs { display: none; }
.qr-x { font-size: 11px; opacity: .55; margin-left: 2px; }
body.grp-on #categoryGrid { margin-top: 4px; }
@media (max-width: 900px) {
    .qr-row { padding: 0 10px 8px; gap: 6px; }
    .qr-i { height: 34px; background: rgba(255,255,255,.08); font-size: 13px; }
    .qr-sell { margin-left: 0; }
    .page section, .toolbar { scroll-margin-top: 175px; }
}
.qr-next { display: none; position: absolute; right: 8px; top: 0; width: 32px; height: 32px; border: 0; border-radius: 999px; background: #fff; color: #17202a; font-size: 22px; line-height: 1; cursor: pointer; box-shadow: 0 2px 8px rgba(0,0,0,.3); }
.qr-wrap.more .qr-next { display: block; }
.qr-wrap.more .qr-row { -webkit-mask-image: linear-gradient(90deg, #000 85%, transparent); mask-image: linear-gradient(90deg, #000 85%, transparent); }
.qr-wrap.more.less .qr-row { -webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 85%, transparent); mask-image: linear-gradient(90deg, transparent, #000 6%, #000 85%, transparent); }
@media (max-width: 900px) { .qr-next { display: none !important; } }
