/**
 * Минимальные стили ТОЛЬКО для страниц:
 * statistic/rating/mythic_plus, pvp, fly_rating, forum, game/armory, reviews, statistic/df_online.
 * Только то, что реально используется в разметке этих страниц (body, page, Pane, space-*, font-*, contain-*, table, text alignment).
 */

/* Фон сайта — одно место. Nav-файлы не задают body background. */
body {
    margin: 0;
    background-color: #1a1a1a;
}

/* --- Обёртки страницы --- */
.body {
    min-height: 100%;
    overflow: hidden;
    position: relative;
}

.page {
    padding-top: var(--nav-height, 56px);
    font-size: 1rem;
    line-height: 1.5;
    background: #000;
    box-shadow: 0 0 50px rgba(11, 6, 4, 0.8);
    margin: 0 auto;
    max-width: 2400px;
    min-height: 100%;
    overflow-y: auto;
    overflow-x: hidden;
    position: relative;
}

@media screen and (min-width: 960px) {
    .page { padding-top: 0; }
}

/* --- Мобильная адаптация (в стиле страницы) --- */
@media screen and (max-width: 1094px) {
    :root { --nav-height: 70px; }
    .page {
        padding-top: 70px;
        padding-left: 0;
        padding-right: 0;
    }
}

@media screen and (max-width: 767.98px) {
    .page {
        padding-top: 70px;
        padding-left: 0;
        padding-right: 0;
        box-sizing: border-box;
    }
    .contain-wide {
        padding-left: 0;
        padding-right: 0;
        max-width: 100%;
        box-sizing: border-box;
    }
    .font-semp-xxxLarge-white {
        font-size: clamp(1.75rem, 8vw, 2.5rem);
        line-height: 1.2;
    }
    .font-bliz-light-xLarge-white {
        font-size: clamp(1.35rem, 5vw, 1.8rem);
    }
    .font-bliz-light-small-beige {
        font-size: 1rem;
    }
}

@media screen and (max-width: 480px) {
    .page {
        padding-left: 0;
        padding-right: 0;
    }
    .contain-wide { padding-left: 0; padding-right: 0; }
    .space-large { height: 40px; }
    .space-huge { height: 60px; }
}

/* --- Pane (блок с фоном) --- */
.Pane {
    position: relative;
}

.Pane-bg {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.Pane-overlay {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    pointer-events: none;
}

.Pane-content {
    position: relative;
    z-index: 1;
}

.Pane--dirtBlue .Pane-bg,
.Pane--dirtDark .Pane-bg {
    background-color: #1a1a1a;
}

.bordered::before {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08);
    content: '';
    display: block;
    pointer-events: none;
    z-index: 1;
}

/* --- Отступы (space-*) --- */
.space-small { height: 10px; }
.space-normal { height: 20px; }
.space-medium { height: 40px; }
.space-large { height: 60px; }
.space-huge { height: 100px; }
.space-rhythm-medium { height: 24px; }

/* --- Выравнивание и отступы --- */
.align-left { text-align: left; }
.margin-none { margin: 0 !important; }

/* --- Шрифты (заголовки/подзаголовки страниц) --- */
.font-semp-xxxLarge-white {
    font-size: 3.225rem;
    line-height: 1.5;
    font-family: "Semplicita Pro", "Open Sans", Arial, Helvetica, sans-serif;
    color: #fff;
    text-shadow: 0 0 1px transparent, 0 1px 2px rgba(0, 0, 0, 0.8);
    font-weight: 700;
}

.font-bliz-light-small-beige {
    font-size: 1.08rem;
    line-height: 1.5;
    font-family: "Open Sans", Arial, Helvetica, sans-serif;
    color: #ebdec2;
    text-shadow: 0 0 1px transparent, 0 1px 2px rgba(0, 0, 0, 0.8);
    font-weight: 400;
}

.font-bliz-light-xLarge-white {
    font-size: 2.2395rem;
    line-height: 1.5;
    font-family: "Open Sans", Arial, Helvetica, sans-serif;
    color: #fff;
    text-shadow: 0 0 1px transparent, 0 1px 2px rgba(0, 0, 0, 0.8);
    font-weight: 400;
}

/* --- Контейнеры --- */
.contain-wide {
    margin-left: auto;
    margin-right: auto;
    max-width: 980px;
}

.contain-left { margin-left: 0; }

/* --- Разделитель --- */
.Divider {
    display: block;
    height: 0;
    border: none;
    margin: 0;
    padding: 0;
}

/* --- Таблица (базовые классы, если не переопределены в компоненте) --- */
.table-responsive {
    display: block;
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.content-area {
    margin-left: auto;
    margin-right: auto;
}

.text-center { text-align: center !important; }
.text-left { text-align: left !important; }

/* Причина ломаной мобилки: другие CSS (combined, navbar) задают body/ширины. Перебиваем разом. */
@media screen and (max-width: 767.98px) {
    html { overflow-x: hidden !important; -webkit-text-size-adjust: 100%; }
    body { overflow-x: hidden !important; width: 100% !important; min-width: 0 !important; }
    #app, .wrapper { overflow-x: hidden !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; box-sizing: border-box; }
    .inner-page, .inner-page__content { max-width: 100% !important; overflow-x: hidden !important; box-sizing: border-box; }
    .tw-btn, a.tw-btn { min-height: 44px; min-width: 44px; }
}