/* =====================================================
   mobile.css — мобильная версия okgamer.ru
   Подключается в main.tpl с media="(max-width: 999px)",
   поэтому на ПК не применяется вообще.
   Шаг 1: каркас, шапка, меню, главная и категории.
   ===================================================== */
@media (max-width: 999px) {

/* ── Каркас: убираем фиксированную ширину 1300–1350px ── */
html, body { overflow-x: hidden; }
body { font-size: 13px; -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
.main_resize, .center_lvl_main, .all_width_block, .all_width_block.mid,
.all_width_block.footer, .all_logo, .logonew {
    width: auto !important; min-width: 0 !important; max-width: 100% !important;
}
img, video, iframe { max-width: 100%; }

/* ── Шапка: без пяти больших фоновых картинок ── */
header { height: auto; padding: 0; }
.clouds_three, .clouds_two, .clouds_one, .s_line, .svet {
    background: none; height: auto;
}
.header_right_menus { float: none; margin: 0; padding: 6px 8px 0; }
.all_logo { position: static; }
.all_logo .logo { float: none; margin: 0; transform: none; text-align: center; padding: 6px 0 4px; }
.all_logo .logo img {
    width: 100% !important; max-width: 360px; height: auto;
    position: static !important; top: 0 !important; left: 0 !important;
}

/* верхнее меню: переносится в две строки вместо одной длинной */
.topmenu-wrap {
    height: auto; flex-wrap: wrap; padding: 6px 8px; gap: 6px; box-sizing: border-box;
    -webkit-backdrop-filter: none; backdrop-filter: none;
    background: rgba(255,255,255,0.6);
}
.topmenu-nav { flex-wrap: wrap; order: 2; width: 100%; justify-content: center; }
.topmenu-link { padding: 6px 8px; font-size: 13px; }
.topmenu-sep { display: none; }
.topmenu-right { margin-left: auto; flex-wrap: wrap; justify-content: flex-end; }
.topmenu-share { display: none; }

/* кнопка «☰ Меню» (на ПК скрыта стилем в main.tpl) */
.topmenu-wrap .okg-m-burger {
    display: inline-flex; align-items: center; gap: 6px;
    background: #21cbfc; color: #fff; border: 0; border-radius: 20px;
    padding: 7px 14px; font: 700 13px Tahoma, Arial, sans-serif; cursor: pointer;
}

/* ── Центральная часть ── */
.center_lvl_main { top: 0; }
.center_back { height: auto; padding: 8px 6px 10px; background: none; }
.all_width_block.mid { display: flex; flex-direction: column; }
.left_side { display: contents; }
.left_side > .left_block:nth-of-type(2) { order: 1; }   /* реклама над играми, как на ПК в первом экране */
.center_side { order: 2; }
.right_side { order: 3; }
.left_side, .center_side, .right_side {
    float: none; width: auto; max-width: 100%; margin: 0 0 12px;
}
.left_block, .right_block { min-height: 0; margin-bottom: 12px; }
.check, .check2 { display: none; }
.r_r, .r_s { margin: 0 0 10px; }
.center_block { min-height: 0; padding: 6px 8px; }
.too_top { display: none; }

/* меню категорий: выезжает слева по кнопке «☰ Меню» */
.left_side > .left_block:first-of-type {
    position: fixed; z-index: 10001; top: 0; bottom: 0; left: 0;
    width: 86%; max-width: 330px; margin: 0; border-radius: 0 10px 10px 0;
    overflow-y: auto; -webkit-overflow-scrolling: touch;
    transform: translateX(-105%); transition: transform .2s ease-out;
    visibility: hidden;
}
html.okg-m-menu .left_side > .left_block:first-of-type { transform: none; visibility: visible; }
.left_block .okg-side-nav { width: auto; }
.okg-m-shade {
    position: fixed; z-index: 10000; inset: 0; background: rgba(0,0,0,.45);
}
html.okg-m-menu .okg-m-shade { display: block; }
html.okg-m-menu, html.okg-m-menu body { overflow: hidden; }

/* поиск */
.search_midl { float: none; margin: 0 0 8px; border-radius: 10px; display: block; }
.search_midl form { display: flex; align-items: center; }
.search_midl input.inputstyle_01 { flex: 1; width: auto; min-width: 0; font-size: 16px; float: none; background-size: 100% 100%; }

/* ── Карточки игр: 2 в ряд, от 600px — 3 ── */
.block {
    width: 46.9%; height: 0; padding-bottom: 32.9%; /* пропорции 274x192 */
    margin: 0 1.5% 10px !important;
}
.block img {
    top: 0; left: 0; width: 100%; height: 100%; padding: 3px; box-sizing: border-box; border-radius: 12px;
}
.block .mask span {
    position: absolute; top: auto; bottom: 3px; left: 3px; right: 3px;
    width: auto; height: auto; display: block; padding: 5px 6px;
    font-size: 12px; line-height: 14px; border-radius: 0 0 10px 10px;
}
.block b { display: none; }
/* фоновое видео на карточках: на телефоне наведения нет, видео не нужно и не грузится */
.block video, .block .videos { display: none !important; }
@media (min-width: 600px) {
    .block { width: 30.2%; padding-bottom: 21.2%; }
}

/* заголовки разделов не встают рядом с карточками */
.smessage, .af2, .navigation, .patht, .path { clear: both; }

/* блоки «Новые комментарии» и т.п. */
.forumnew, .forumnew2 { float: none; width: auto; margin: 10px 0 0; height: auto; max-height: 300px; }

/* ── Подвал: без сдвигов на сотни пикселей ── */
footer { padding: 16px 0 4px; margin: 0; background: #2b2b2b url(../images/new/footer_bg3.jpg) center bottom / cover no-repeat; }
.footer_block_bg, .footer_block_bg.first, .footer_block_bg.last {
    position: static; top: 0; float: none; width: auto; height: auto;
    margin: 0 8px 10px; padding: 8px 12px; background: #fff; border-radius: 8px;
}
.footer_block_bg ul { padding-top: 6px; }
.footer_block_bg ul li { padding: 6px 0; }
.center_block_cop { color: #ccc; }

/* второстепенные блоки (помечены в main.tpl классом okg-m-hide) */
.okg-m-hide, .oshibka { display: none !important; }

/* плашка нетплея внизу экрана — не шире экрана */
#netplay-lobby-bar { max-width: 100%; }
}
