/*
Theme Name: Metodshkola Theme
Theme URI: #
Author: Tumchaev Ahmed
Author URI: #
Description: Оболочка «Аэро» для аналитической платформы: сайдбар 236px, топбар 62px, тёмный режим через body.ms-dark-mode, зелёные градиенты. Работает в паре с плагином Grozny Education Analytics.
Version: 2.2.0
Requires at least: 6.0
Tested up to: 7.0
Requires PHP: 8.0
Text Domain: metodshkola
Tags: full-width-template, custom-menu, custom-logo, translation-ready
*/

/* ==========================================================================
   Шрифты
   ========================================================================== */
@font-face {
    font-family: 'Inter';
    src: url('assets/fonts/Inter-Regular.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Inter';
    src: url('assets/fonts/Inter-Medium.woff2') format('woff2');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Inter';
    src: url('assets/fonts/Inter-SemiBold.woff2') format('woff2');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Inter';
    src: url('assets/fonts/Inter-Bold.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

/* ==========================================================================
   Дизайн-токены «Аэро» (канон — design-spec.md)
   ========================================================================== */
:root {
    --ms-font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

    /* Каркас */
    --ms-header-height: 62px;
    --ms-sidebar-width: 236px;
    --ms-sidebar-mini: 76px;
    --ms-content-max-width: 1400px;

    /* Палитра — светлая схема */
    --ms-bg: #f4f6f5;
    --ms-surface: #ffffff;
    --ms-surface-2: #f8faf9;
    --ms-border: #e6ebe8;
    --ms-border-soft: #eef2ef;
    --ms-text-main: #17241e;
    --ms-text-muted: #5f6f68;
    --ms-text-faint: #94a3a0;

    /* Акцент (primary переопределяется Customizer-ом) */
    --ms-primary: #10b981;
    --ms-primary-2: #059669;
    --ms-primary-gradient: linear-gradient(135deg, var(--ms-primary), var(--ms-primary-2));
    --ms-primary-soft: rgba(16, 185, 129, .10);
    --ms-primary-glow: 0 4px 12px rgba(16, 185, 129, .28);
    --ms-accent-light: #10b981;

    /* Статические фолбэки токенов, обычно приходящих из GA_customize_to_js (F6) */
    --ms-btn-text: #ffffff;
    --ms-header-bg: var(--ms-surface);

    /* Статусные цвета */
    --ms-danger: #ef4444;
    --ms-warning: #f59e0b;
    --ms-success: #16a34a;
    --ms-info: #2563eb;

    /* Радиусы */
    --ms-radius-card: 14px;
    --ms-radius-card-sm: 13px;
    --ms-radius-ctl: 10px;
    --ms-radius-ctl-sm: 9px;

    /* Модули (KPI/спарклайны плагина) */
    --ms-kpi-h: 128px;
    --ms-spark-h: 30px;

    /* Тени */
    --ms-shadow-sm: 0 1px 2px rgba(15, 23, 42, .05);
    --ms-shadow-md: 0 10px 30px rgba(15, 23, 42, .07);
    --ms-shadow-sidebar: 4px 0 24px rgba(0, 0, 0, .02);

    /* Типографика */
    --ms-font-size-base: 14px;

    /* Мега-меню (2.1.0). Цветовых токенов здесь намеренно нет: панель и карточки
       собраны из --ms-surface / --ms-border / --ms-shadow-md / --ms-primary-soft,
       поэтому тёмная схема пересчитывается сама. */
    --ms-mega-flyout-w: 268px;
    --ms-mega-flyout-max-h: min(70vh, 520px);
    --ms-mega-panel-max-h: min(72vh, 640px);
    --ms-mega-panel-pad: 22px;
    --ms-mega-col-gap: 26px;
    --ms-mega-card-icon: 34px;
    --ms-launcher-cols: 4;                      /* перекрывается из Customizer */
    --ms-mega-backdrop-bg: rgba(15, 23, 42, .28);

    /* Слои мега-меню. Карта z-index оболочки: топбар 40 → .gea-toolbar--sticky
       плагина 60 → сайдбар 100 → мобильный оверлей 150 → [200/210 — наши] →
       мобильный сайдбар 9999 → drawer плагина 10000.
       --ms-z-mega-flyout живёт ВНУТРИ стек-контекста сайдбара (100),
       поэтому в глобальной карте не участвует. */
    --ms-z-mega-flyout: 20;
    --ms-z-mega-backdrop: 200;
    --ms-z-mega-panel: 210;
    --ms-z-route-progress: 300;   /* поверх панели: индикатор виден всегда */

    /* Плотность интерфейса (2.2.0).
       Просторный режим — значения по умолчанию. Компактный переопределяет их
       ниже, в body.ms-density-compact: реестр контингента — это 63 тысячи
       строк, и лишние 6 пикселей на строку стоят пользователю трети экрана. */
    --ms-row-py: 10px;
    --ms-row-px: 13px;
    --ms-main-py: 24px;
    --ms-main-px: 28px;
}

/* Компактная плотность. Меняем ТОЛЬКО токены — правила остаются общими,
   поэтому режим бесплатно доходит и до компонентов плагина через CSS-мост
   (--gea-kpi-h / --gea-spark-h). */
body.ms-density-compact {
    --ms-row-py: 6px;
    --ms-row-px: 11px;
    --ms-main-py: 14px;
    --ms-main-px: 18px;
    --ms-kpi-h: 104px;
    --ms-spark-h: 24px;
    --ms-radius-card: 12px;
    --ms-radius-card-sm: 11px;
}

/* Алиасы старых имён токенов (потребители: plugin-compat.css и CSS плагина 1.47.6).
   Объявлены и на body, чтобы var() пересчитывались при тёмной схеме. */
:root, body {
    --ms-bg-color: var(--ms-bg);
    --ms-primary-dark: var(--ms-primary-2);
}

/* ==========================================================================
   Тёмная схема — единая точка переопределения токенов
   ========================================================================== */
body.ms-dark-mode {
    --ms-bg: #101714;
    --ms-surface: #161f1b;
    --ms-surface-2: #1c2723;
    --ms-border: #232e29;
    --ms-border-soft: #1d2823;
    --ms-text-main: #e7eeea;
    --ms-text-muted: #9aa8a1;
    --ms-text-faint: #5f7a6e;
    --ms-primary-soft: rgba(16, 185, 129, .16);
    --ms-accent-light: #4ade80;
    --ms-danger: #f87171;
    --ms-warning: #fbbf24;
    --ms-success: #4ade80;
    --ms-info: #60a5fa;
    --ms-shadow-sm: 0 1px 2px rgba(0, 0, 0, .3);
    --ms-shadow-md: 0 10px 30px rgba(0, 0, 0, .35);
    --ms-shadow-sidebar: 4px 0 24px rgba(0, 0, 0, .25);
    --ms-mega-backdrop-bg: rgba(0, 0, 0, .55);   /* согласовано с .ms-mobile-overlay */
}

/* ==========================================================================
   База
   ========================================================================== */
body {
    margin: 0;
    padding: 0;
    font-family: var(--ms-font-family);
    font-size: var(--ms-font-size-base);
    background-color: var(--ms-bg);
    color: var(--ms-text-main);
    overflow-x: hidden;
}

a { color: var(--ms-primary); text-decoration: none; transition: 0.2s; }
button { cursor: pointer; border: none; background: none; outline: none; transition: 0.2s; font-family: inherit; }

/* Индикатор перехода между разделами.
   Платформа многостраничная: клик по меню — это полная перезагрузка, а дашборд
   потом ещё догружает данные. Нить того же градиента, что и верхняя кромка
   панели «Все разделы», показывает, что запрос принят. Ширину ведёт theme.js. */
.ms-route-progress {
    position: fixed;
    top: 0;
    left: 0;
    width: 0;
    height: 2px;
    background: var(--ms-primary-gradient);
    z-index: var(--ms-z-route-progress);
    opacity: 0;
    pointer-events: none;
    transition: width 0.25s cubic-bezier(0.2, 0.8, 0.3, 1), opacity 0.2s;
}

.ms-route-progress.is-active {
    opacity: 1;
}

body.admin-bar .ms-route-progress {
    top: var(--wp-admin--admin-bar--height, 32px);
}

/* Пункт, по которому только что кликнули: подтверждение до перезагрузки */
.ms-menu-list li.is-navigating > a {
    background: var(--ms-primary-soft);
    color: var(--ms-primary);
}

/* Ссылка «К содержимому»: до таблицы в меню больше двадцати пунктов */
.ms-skip-link {
    position: absolute;
    top: -100px;
    left: 12px;
    z-index: calc(var(--ms-z-route-progress) + 10);
    padding: 10px 16px;
    background: var(--ms-surface);
    color: var(--ms-primary);
    border: 1px solid var(--ms-primary);
    border-radius: var(--ms-radius-ctl);
    box-shadow: var(--ms-shadow-md);
    font-size: 13px;
    font-weight: 600;
    transition: top 0.2s;
}

.ms-skip-link:focus {
    top: 12px;
}

body.admin-bar .ms-skip-link:focus {
    top: calc(var(--wp-admin--admin-bar--height, 32px) + 12px);
}

/* Текст только для скринридеров.
   Обычно этот класс приходит из wp-block-library, но includes/performance.php
   его снимает (dequeue) — без собственного определения подписи для
   вспомогательных технологий оказались бы видны на экране. */
.screen-reader-text {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
}

/* Видимый фокус (доступность) */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
    outline: 2px solid var(--ms-primary);
    outline-offset: 2px;
    box-shadow: 0 0 0 4px var(--ms-primary-soft);
}

/* ==========================================================================
   App Layout (Sidebar Engine)
   ========================================================================== */
.ms-app-layout {
    display: flex;
    min-height: 100vh;
}

/* Мобильный оверлей */
.ms-mobile-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(15, 23, 42, 0.4);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    z-index: 150;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
}

body.ms-dark-mode .ms-mobile-overlay { background: rgba(0, 0, 0, 0.55); }

.mobile-open .ms-mobile-overlay {
    opacity: 1;
    visibility: visible;
}

/* САЙДБАР
   ВНИМАНИЕ (мега-меню 2.1.0): не добавляй сюда transform / filter / will-change /
   contain / backdrop-filter. Флайаут подменю в mini-режиме — position: fixed, и он
   не обрезается `overflow: hidden` ниже РОВНО ПОТОМУ, что ни у одного предка нет
   этих свойств. Любое из них сделает сайдбар containing block'ом, и флайаут
   мгновенно обрежется. Анимацию «выезда» делай через width/left, как сейчас. */
.ms-sidebar {
    width: var(--ms-sidebar-width);
    background-color: var(--ms-surface);
    border-right: 1px solid var(--ms-border);
    display: flex;
    flex-direction: column;
    transition: width 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 100;
    box-shadow: var(--ms-shadow-sidebar);
}

/* App-shell: сайдбар закреплён во всю высоту вьюпорта, меню скроллится ВНУТРИ,
   профиль-карточка всегда прижата к низу (только десктоп ≥1025px). */
@media (min-width: 1025px) {
    .ms-sidebar {
        position: sticky;
        top: 0;
        height: 100vh;
        overflow: hidden;
    }
    /* Учёт админ-бара WP: опустить и укоротить сайдбар на его высоту */
    body.admin-bar .ms-sidebar {
        top: var(--wp-admin--admin-bar--height, 32px);
        height: calc(100vh - var(--wp-admin--admin-bar--height, 32px));
    }
}

/* Шапка сайдбара: бренд + кнопки управления */
.ms-sidebar-header {
    height: var(--ms-header-height);
    flex: none;
    padding: 0 10px 0 18px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    border-bottom: 1px solid var(--ms-border-soft);
}

.ms-brand { min-width: 0; overflow: hidden; white-space: nowrap; }
.ms-brand a { color: var(--ms-text-main); display: flex; align-items: center; gap: 10px; font-weight: 700; font-size: 16px; min-width: 0; }
/* Логотип вписывается в доступную ширину бренда (не обрезается по краю сайдбара) */
.ms-brand img, .ms-brand .custom-logo-link img { max-height: 36px; max-width: 100%; width: auto; object-fit: contain; }

.ms-brand-badge {
    width: 32px;
    height: 32px;
    flex: none;
    border-radius: var(--ms-radius-ctl-sm);
    background: var(--ms-primary-gradient);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 16px;
}

.ms-logo-full { font-weight: 700; font-size: 15px; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* Мини-плашка бренда: буква сайта, видна только в mini-режиме сайдбара (F5) */
.ms-brand-badge--mini { display: none; }

.ms-sidebar-actions { display: flex; align-items: center; gap: 2px; flex: none; }

.ms-sidebar-toggle,
.ms-sidebar-hide-btn {
    width: 30px;
    height: 30px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--ms-text-faint);
    font-size: 19px;
    background: transparent;
    transition: 0.2s;
}

.ms-sidebar-toggle:hover,
.ms-sidebar-hide-btn:hover {
    background: var(--ms-surface-2);
    color: var(--ms-text-main);
}

/* Навигация сайдбара. min-height:0 обязателен — иначе flex-колонка не даёт
   nav сжиматься, скролл не включается и профиль-карточку выдавливает за экран. */
.ms-sidebar-nav {
    flex: 1;
    min-height: 0;
    padding: 16px 12px;
    overflow-y: auto;
    overflow-x: hidden;
    scrollbar-width: thin;
    scrollbar-color: var(--ms-border) transparent;
}
.ms-sidebar-nav::-webkit-scrollbar { width: 6px; }
.ms-sidebar-nav::-webkit-scrollbar-thumb { background: var(--ms-border); border-radius: 6px; }
.ms-sidebar-nav::-webkit-scrollbar-track { background: transparent; }

.ms-menu-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 3px; }
.ms-menu-list li { margin: 0; padding: 0; }

.ms-menu-list a {
    display: flex;
    align-items: center;
    gap: 11px;
    padding: var(--ms-row-py) var(--ms-row-px);
    border-radius: var(--ms-radius-ctl-sm);
    color: var(--ms-text-muted);
    font-weight: 500;
    transition: background 0.2s, color 0.2s;
}

.ms-menu-list a i {
    font-size: var(--ms-menu-icon-size, 19px);
    color: var(--ms-menu-icon-color, currentColor);
    min-width: 22px;
    text-align: center;
}

/* Активный/hover пункт — иконка наследует цвет текста */
.ms-menu-list li.current-menu-item a i,
.ms-menu-list a:hover i {
    color: inherit;
}

.ms-menu-list a:hover {
    background: var(--ms-primary-soft);
    color: var(--ms-primary);
}

.ms-menu-list li.current-menu-item a {
    background: var(--ms-primary-gradient);
    color: #fff !important;
    font-weight: 600;
    box-shadow: var(--ms-primary-glow);
}

/* Бейджи пунктов меню (pill) */
.ms-menu-list .ms-menu-badge {
    margin-left: auto;
    background: var(--ms-primary);
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    line-height: 1.6;
    border-radius: 999px;
    padding: 1px 7px;
}
.ms-menu-list li.current-menu-item a .ms-menu-badge { background: rgba(255, 255, 255, .25); }

/* Вложенное меню (depth 2) */
.ms-menu-list .sub-menu {
    list-style: none;
    margin: 2px 0 4px;
    padding: 0 0 0 34px;
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.ms-menu-list .sub-menu a { padding: 7px 10px; font-size: 13px; }

/* Подвал сайдбара: профиль-карточка */
.ms-sidebar-footer {
    padding: 12px;
    border-top: 1px solid var(--ms-border-soft);
    transition: 0.3s;
}

.ms-sidebar-profile {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    background: #f2f8f5;
    border: 1px solid #d9ece3;
    border-radius: 11px;
    min-width: 0;
}

body.ms-dark-mode .ms-sidebar-profile {
    background: var(--ms-surface-2);
    border-color: var(--ms-border);
}

.ms-sidebar-profile-avatar {
    flex: none;
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--ms-primary);
}
.ms-sidebar-profile-avatar img { width: 28px; height: 28px; border-radius: 50%; display: block; }
.ms-sidebar-profile-avatar i { font-size: 26px; line-height: 1; }

/* Аватар-инициалы: рисуется локально, без запроса к Gravatar.
   Оттенок один для всех — в сайдбаре аватар всегда один и различать людей
   цветом не нужно, а пёстрая плашка спорила бы с акцентом «Аэро». */
.ms-avatar-initials {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--ms-primary-soft);
    color: var(--ms-primary);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    user-select: none;
}

.ms-user-info .ms-avatar-initials {
    width: 28px;
    height: 28px;
    font-size: 11px;
}

.ms-sidebar-profile-info { min-width: 0; flex: 1; display: flex; flex-direction: column; }
.ms-sidebar-profile-name {
    font-size: 13px;
    font-weight: 600;
    color: var(--ms-text-main);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.ms-sidebar-profile-role {
    font-size: 11px;
    color: var(--ms-text-muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Иконки-действия: инжекты хука metodshkola_user_info_extras (сообщения, ИИ-чат) + выход */
.ms-sidebar-profile-extras {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: none;
}
.ms-sidebar-profile-extras a { display: inline-flex; align-items: center; color: var(--ms-text-faint); }
.ms-sidebar-profile-extras a:hover { color: var(--ms-primary); }
.ms-sidebar-profile-extras i,
.ms-sidebar-profile-extras .ms-user-icon { font-size: 18px; line-height: 1; }

/* Выход (общий стиль для сайдбара и топбара) */
.ms-logout-link { color: var(--ms-text-faint); font-size: 17px; transition: 0.2s; display: inline-flex; align-items: center; }
.ms-logout-link:hover,
.ms-sidebar-profile-extras .ms-logout-link:hover { color: var(--ms-danger); }

/* Кнопка «Войти» (гость) */
.ms-btn-login {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 9px 18px;
    border-radius: var(--ms-radius-ctl);
    background: var(--ms-primary-gradient);
    color: var(--ms-btn-text, #fff);
    font-weight: 600;
    box-shadow: var(--ms-primary-glow);
}
.ms-btn-login:hover { filter: brightness(1.06); color: var(--ms-btn-text, #fff); }
.ms-sidebar-footer .ms-btn-login { width: 100%; }

/* MINI и HIDDEN состояния — только десктоп */
@media (min-width: 1025px) {
    .ms-app-layout.sidebar-mini .ms-sidebar { width: var(--ms-sidebar-mini); }
    .ms-app-layout.sidebar-hidden .ms-sidebar { width: 0; padding: 0; border: none; overflow: hidden; }
    .ms-app-layout.sidebar-hidden .ms-sidebar-header,
    .ms-app-layout.sidebar-hidden .ms-sidebar-nav,
    .ms-app-layout.sidebar-hidden .ms-sidebar-footer { opacity: 0; pointer-events: none; }

    .ms-app-layout.sidebar-mini .ms-logo-full,
    .ms-app-layout.sidebar-mini .ms-brand .custom-logo-link { display: none; }
    /* Вместо скрытого логотипа — буква-плашка бренда (F5) */
    .ms-app-layout.sidebar-mini .ms-brand-badge--mini { display: flex; }
    .ms-app-layout.sidebar-mini .ms-sidebar-header { justify-content: center; padding: 0 6px; gap: 6px; }
    .ms-app-layout.sidebar-mini .ms-sidebar-hide-btn { display: none; }

    .ms-app-layout.sidebar-mini .ms-menu-text,
    .ms-app-layout.sidebar-mini .ms-menu-badge,
    .ms-app-layout.sidebar-mini .ms-menu-list .sub-menu { display: none; }
    .ms-app-layout.sidebar-mini .ms-sidebar-nav { padding: 16px 0; }
    .ms-app-layout.sidebar-mini .ms-menu-list { align-items: center; gap: 6px; }
    .ms-app-layout.sidebar-mini .ms-menu-list a {
        width: 44px;
        height: 44px;
        justify-content: center;
        padding: 0;
        border-radius: 10px;
    }
    .ms-app-layout.sidebar-mini .ms-menu-list a i { font-size: 21px; min-width: 0; }

    /* Профиль-карточка сжимается до аватара */
    .ms-app-layout.sidebar-mini .ms-sidebar-footer { padding: 12px 0; display: flex; justify-content: center; }
    .ms-app-layout.sidebar-mini .ms-sidebar-profile {
        padding: 6px;
        background: transparent;
        border: none;
        justify-content: center;
    }
    .ms-app-layout.sidebar-mini .ms-sidebar-profile-info,
    .ms-app-layout.sidebar-mini .ms-sidebar-profile-extras { display: none; }
    .ms-app-layout.sidebar-mini .ms-sidebar-footer .ms-btn-login { width: auto; padding: 9px 8px; font-size: 11px; }
}

/* ==========================================================================
   Топбар
   ========================================================================== */
.ms-app-main-container { flex: 1; display: flex; flex-direction: column; min-width: 0; }

.ms-topbar {
    height: var(--ms-header-height);
    flex: none;
    background: rgba(255, 255, 255, 0.85);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border-bottom: 1px solid var(--ms-border);
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 0 24px;
    position: sticky;
    top: 0;
    z-index: 40;
}

/* Компенсация admin-bar WP: без неё липкий топбар уезжает под панель при скролле */
body.admin-bar .ms-topbar { top: var(--wp-admin--admin-bar--height, 32px); }

body.ms-dark-mode .ms-topbar { background: rgba(22, 31, 27, 0.85); }

.ms-topbar-left { display: flex; align-items: center; gap: 14px; min-width: 0; }

/* Заголовок страницы + подзаголовок */
.ms-topbar-heading { display: flex; align-items: baseline; gap: 10px; min-width: 0; }
.ms-topbar-title {
    margin: 0;
    font-size: 15px;
    font-weight: 600;
    color: var(--ms-text-main);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.ms-topbar-subtitle {
    font-size: 12.5px;
    color: var(--ms-text-faint);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 420px;
}
@media (max-width: 1279px) {
    .ms-topbar-subtitle { display: none; }
}

/* Слот контекстных элементов модуля (заполняет плагин) */
.ms-topbar-slot {
    flex: 1;
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

.ms-topbar-right { display: flex; align-items: center; gap: 14px; margin-left: auto; flex: none; }

/* Глобальные фильтры (заполняет плагин через хук metodshkola_topbar_filters) */
.ms-topbar-filters { display: flex; align-items: center; gap: 10px; }
.ms-topbar-filters:empty { display: none; }
/* Плагин печатает пустой #gea-global-filters на всех страницах — прячем обёртку,
   пока внутри нет ни одного контрола (иначе пустой элемент ест flex-gap) */
.ms-topbar-filters:not(:has(select, button, input)) { display: none; }

/* Иконко-кнопки топбара 36×36 */
.ms-scheme-toggle,
.ms-topbar-icon-btn {
    width: 36px;
    height: 36px;
    flex: none;
    border-radius: var(--ms-radius-ctl-sm);
    background: #eef3f0;
    color: var(--ms-text-muted);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
}
.ms-scheme-toggle:hover,
.ms-topbar-icon-btn:hover { color: var(--ms-primary); }

body.ms-dark-mode .ms-scheme-toggle,
body.ms-dark-mode .ms-topbar-icon-btn {
    background: var(--ms-bg);
    border: 1px solid var(--ms-border);
    color: var(--ms-warning);
}
/* Hover иконко-кнопок в тёмной схеме — перекрывает жёлтый по умолчанию (F4) */
body.ms-dark-mode .ms-scheme-toggle:hover,
body.ms-dark-mode .ms-topbar-icon-btn:hover { color: var(--ms-primary); }

/* Блок пользователя в топбаре (режим ms_user_block_position = topbar) */
.ms-user-info {
    display: flex;
    align-items: center;
    gap: 12px;
    padding-left: 16px;
    border-left: 1px solid var(--ms-border);
}
.ms-user-icon { font-size: 26px; color: var(--ms-primary); line-height: 1; }
.ms-user-name { font-weight: 600; color: var(--ms-text-main); font-size: 0.9rem; white-space: nowrap; }

/* Второстепенное меню топбара */
.ms-topbar-secondary-nav ul {
    display: flex;
    list-style: none;
    gap: 20px;
    margin: 0;
    padding: 0;
}
.ms-topbar-secondary-nav a {
    color: var(--ms-text-muted);
    font-size: 0.85rem;
    font-weight: 500;
    transition: 0.2s;
}
.ms-topbar-secondary-nav a:hover { color: var(--ms-primary); }

/* ==========================================================================
   Виджеты дашборда (Stat Cards)
   ========================================================================== */
.ms-stats-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 14px;
    margin-bottom: 28px;
    align-items: stretch;
}

@media (min-width: 1600px) {
    .ms-stats-grid { grid-template-columns: repeat(4, 1fr); }
}

.ms-stat-card {
    background: var(--ms-surface);
    border: 1px solid var(--ms-border);
    border-radius: var(--ms-radius-card);
    padding: 18px;
    display: flex;
    align-items: center;
    gap: 15px;
    box-shadow: var(--ms-shadow-sm);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.ms-stat-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--ms-shadow-md);
}

.ms-card-icon-box {
    width: 50px;
    height: 50px;
    background: var(--ms-primary-gradient);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 24px;
    flex-shrink: 0;
}

.ms-card-content { flex: 1; min-width: 0; }
.ms-card-title {
    margin: 0;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--ms-text-muted);
    font-weight: 600;
}

.ms-card-value-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    margin-top: 4px;
}

.ms-card-value {
    font-size: 23px;
    font-weight: 700;
    color: var(--ms-text-main);
    font-variant-numeric: tabular-nums;
}

.ms-card-trend {
    font-size: 12px;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 4px;
}
.ms-trend-up { color: var(--ms-success); }
.ms-trend-down { color: var(--ms-danger); }

/* Контентная область */
.ms-app-main { padding: var(--ms-main-py) var(--ms-main-px); flex: 1; }

/* ==========================================================================
   Футер (внутри .ms-app-main-container — справа от сайдбара)
   ========================================================================== */
.ms-app-footer {
    margin-top: auto;
    border-top: 1px solid var(--ms-border);
    padding: 16px 28px;
    transition: 0.3s;
}

.ms-footer-container {
    max-width: var(--ms-content-max-width);
    margin: 0 auto;
}

.ms-footer-widgets {
    display: grid;
    gap: 32px;
    margin-bottom: 20px;
    padding-bottom: 18px;
    border-bottom: 1px solid var(--ms-border-soft);
}

.ms-grid-cols-1 { grid-template-columns: 1fr; }
.ms-grid-cols-2 { grid-template-columns: repeat(2, 1fr); }
.ms-grid-cols-3 { grid-template-columns: repeat(3, 1fr); }
.ms-grid-cols-4 { grid-template-columns: repeat(4, 1fr); }

.ms-widget-title {
    font-size: 1rem;
    font-weight: 700;
    margin-bottom: 14px;
    color: var(--ms-text-main);
}

.ms-footer-col ul { list-style: none; padding: 0; margin: 0; }
.ms-footer-col li { margin-bottom: 8px; }
.ms-footer-col a { color: var(--ms-text-muted); font-size: 12.5px; transition: 0.2s; }
.ms-footer-col a:hover { color: var(--ms-primary); padding-left: 5px; }

/* Стили футера */
.footer-style-glass {
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    background: rgba(255, 255, 255, 0.7);
}
body.ms-dark-mode .footer-style-glass { background: rgba(22, 31, 27, 0.6); }

.footer-style-dark {
    background: #1e293b;
    color: #f1f5f9;
}
.footer-style-dark .ms-widget-title,
.footer-style-dark .ms-footer-copyright { color: #fff; }
.footer-style-dark .ms-footer-col a { color: #94a3b8; }

.ms-footer-bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
}

.ms-footer-copyright {
    color: var(--ms-text-muted);
    font-size: 12.5px;
}

.ms-footer-social { display: flex; gap: 9px; }
.ms-social-link {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: #eef3f0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--ms-text-muted);
    font-size: 16px;
    transition: 0.3s;
}
body.ms-dark-mode .ms-social-link { background: var(--ms-surface-2); }

.ms-social-link:hover {
    background: var(--ms-primary-gradient);
    color: #fff;
    transform: translateY(-2px);
}

@media (max-width: 768px) {
    .ms-footer-widgets { grid-template-columns: repeat(2, 1fr); }
    .ms-footer-bottom { flex-direction: column; gap: 16px; text-align: center; }
}

@media (max-width: 480px) {
    .ms-footer-widgets { grid-template-columns: 1fr; }
}

/* ==========================================================================
   Гамбургер и мобильный режим (offcanvas), брейкпоинт 1024px
   ========================================================================== */
.ms-mobile-menu-toggle {
    display: none;
    width: 36px;
    height: 36px;
    align-items: center;
    justify-content: center;
    border-radius: var(--ms-radius-ctl-sm);
    font-size: 20px;
    color: var(--ms-text-main);
    cursor: pointer;
}
.ms-mobile-menu-toggle:hover { background: var(--ms-surface-2); }

/* Если сайдбар полностью скрыт (hidden), показываем гамбургер для его возврата */
.layout-sidebar.sidebar-hidden .ms-mobile-menu-toggle { display: flex; }

@media (max-width: 1024px) {
    .ms-mobile-menu-toggle { display: flex; }

    /* Выезжающая панель 310px поверх контента */
    .ms-sidebar {
        position: fixed;
        top: 0;
        left: -110%;
        width: min(86vw, 310px);
        height: 100vh;
        height: 100dvh;
        border-right: 1px solid var(--ms-border);
        transition: left 0.3s cubic-bezier(0.4, 0, 0.2, 1);
        z-index: 9999;
        box-shadow: 8px 0 32px rgba(15, 23, 42, 0.18);
    }
    .ms-app-layout.mobile-open .ms-sidebar { left: 0; }

    /* Кнопка «скрыть полностью» на мобилке не нужна */
    .ms-sidebar-hide-btn { display: none; }

    /* Верхний тогглер превращается в крестик закрытия */
    .ms-sidebar-toggle {
        width: 38px;
        height: 38px;
        border-radius: var(--ms-radius-ctl-sm);
        background: rgba(239, 68, 68, 0.1);
        color: var(--ms-danger);
        font-size: 20px;
    }
    .ms-sidebar-toggle:hover { background: rgba(239, 68, 68, 0.18); color: var(--ms-danger); }
    .ms-sidebar-toggle i::before { content: "\e4f6"; /* phosphor "x" */ }

    /* Меню: крупные touch-таргеты */
    .ms-sidebar-nav { padding: 16px 12px 24px; }
    .ms-menu-list { gap: 5px; }
    .ms-menu-list a {
        padding: 14px 16px;
        font-size: 15px;
        gap: 14px;
        border-radius: 11px;
    }
    .ms-menu-list a i { font-size: 22px; min-width: 26px; }

    /* Блокировка скролла body, когда меню открыто */
    body.ms-mobile-menu-open {
        overflow: hidden;
        touch-action: none;
    }

    /* Топбар: упрощаем */
    .ms-topbar { padding: 0 16px; gap: 12px; }
    .ms-topbar-secondary-nav,
    .ms-topbar-slot,
    .ms-user-name { display: none; }

    .ms-user-info {
        border: none;
        padding-left: 0;
    }
    .ms-user-icon { font-size: 28px; }
}

/* ==========================================================================
   Доступность: сниженная анимация
   ========================================================================== */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
    }
}

/* ==========================================================================
   Метки-группы сайдбар-меню (2.0.2)
   Пункт меню (произвольная ссылка «#») с CSS-классом ms-menu-group
   рендерится как невыбираемый заголовок группы.
   ========================================================================== */
.ms-sidebar-nav li.ms-menu-group > a {
    pointer-events: none;
    cursor: default;
    padding: 14px 13px 4px;
    margin-top: 6px;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .05em;
    color: var(--ms-text-faint);
    background: none;
    box-shadow: none;
}

.ms-sidebar-nav li.ms-menu-group:first-child > a { margin-top: 0; }

@media (min-width: 1025px) {
    /* В mini-режиме метка группы схлопывается в тонкий разделитель */
    .ms-app-layout.sidebar-mini .ms-sidebar-nav li.ms-menu-group > a {
        display: block;
        height: 1px;
        margin: 8px 14px;
        padding: 0;
        overflow: hidden;
        font-size: 0;
        background: var(--ms-border-soft);
        border-radius: 0;
    }
}

/* ==========================================================================
   Печать (2.0.3): печатается только контент — оболочка скрывается,
   тёмная схема принудительно сбрасывается на светлые токены.
   ========================================================================== */
@media print {
    body.ms-dark-mode {
        --ms-bg: #ffffff;
        --ms-surface: #ffffff;
        --ms-surface-2: #f8faf9;
        --ms-border: #d7ddd9;
        --ms-border-soft: #e5eae7;
        --ms-text-main: #17241e;
        --ms-text-muted: #5f6f68;
        --ms-text-faint: #94a3a0;
    }

    body { background: #ffffff !important; }

    .ms-sidebar,
    .ms-topbar,
    .ms-mobile-overlay,
    .ms-app-footer,
    #wpadminbar {
        display: none !important;
    }

    .ms-app-main-container { margin: 0 !important; }
    .ms-app-layout { display: block; }
}