/* ============================================================
   mobile.css — мобильная версия (только телефон)
   Планшет и десктоп остаются на обычной версии.
   Брейкпоинт: max-width: 600px (телефоны в портрете).
   Подключать ПОСЛЕ основных стилей layout.ejs.
   ============================================================ */

@media (max-width: 600px) {

  /* Узкий сайдбар: одно переопределение тянет за собой
     ширину сайдбара, left у полосы меток и margin контента,
     т.к. всё завязано на --sidebar-w */
  :root { --sidebar-w: 58px; }

  /* ---- Сайдбар: узкий, по центру, колонка с порядком ---- */
  .sidebar {
    width: 58px;
    align-items: center;
    padding: 0;
    overflow: hidden;
  }

  /* Логотип — только иконка, без текста */
  .sidebar-logo {
    order: 1;
    padding: 12px 0 4px;
    display: flex;
    justify-content: center;
    width: 100%;
  }
  .sidebar-logo > div { gap: 0 !important; }
  .sidebar-logo svg { width: 30px !important; height: 30px !important; }
  .sidebar-logo-name,
  .sidebar-logo-sub { display: none !important; }

  /* Слот округов (заполняется mobile.js — переносит РФ/ЗС/АЦС) */
  #m-okruga-slot {
    order: 2;
    display: flex;
    flex-direction: column;
    gap: 6px;
    align-items: center;
    padding: 4px 0;
    width: 100%;
  }
  /* Перенесённые кнопки-гербы в сайдбаре */
  #m-okruga-slot .beta-logo-btn {
    flex: 0 0 38px;
    width: 38px;
    height: 38px;
    border-radius: 8px;
  }

  /* Аватар — только фото, без имени/роли */
  .sidebar-user {
    order: 3;
    padding: 6px 0;
    display: flex;
    justify-content: center;
    width: 100%;
  }
  .sidebar-user-info { display: none !important; }
  .sidebar-avatar { width: 36px !important; height: 36px !important; }
  /* кнопка «Войти» (гость) — компактная, только иконка */
  .sidebar-user > button { font-size: 0 !important; padding: 9px !important; gap: 0 !important; }

  /* Режимы профиль/карта/справка — в столбик */
  .mode-selector {
    order: 4;
    visibility: visible !important;
    flex-direction: column;
    gap: 4px;
    padding: 6px 7px;
    border: none !important;
    width: 100%;
  }
  .mode-btn { font-size: 8px; padding: 6px 2px; }

  /* Навигация — только иконки (как в режиме карты) */
  .sidebar-nav {
    order: 5;
    flex: 1;
    width: 100%;
    overflow-y: auto;
    scrollbar-width: none;
  }
  .sidebar-nav::-webkit-scrollbar { width: 0; }

  .profile-nav-col { display: none !important; }   /* полные пункты прячем */
  /* инспектор — полностью убран из мобильной (id перебивает body.mode-map ...!important) */
  #sidebar-inspector,
  .map-inspector-col { display: none !important; }

  .map-nav-col {
    display: flex !important;
    flex-direction: column;
    align-items: center;
    gap: 3px;
    width: 100%;
  }
  .map-nav-col .nav-item {
    width: 38px;
    height: 34px;
    justify-content: center;
    padding: 0;
  }
  .map-nav-col .nav-icon { width: 18px; height: 18px; }
  .map-nav-col .nav-divider { width: 30px; }

  /* Футер — компактная иконка выхода */
  .sidebar-footer { order: 6; padding: 8px 0; display: flex; justify-content: center; }
  .btn-logout { font-size: 0 !important; padding: 8px !important; justify-content: center; gap: 0 !important; }

  /* ---- Контент (профиль/справка) ---- */
  .main { margin-left: 58px; }

  /* ---- Верхний бар-гербы: прячем (3 кнопки уехали в сайдбар,
          остаются mark/fav/msu — не нужны на мобиле) ---- */
  #beta-logo { display: none !important; }

  /* ---- Полоса меток (за сайдбаром) ---- */
  /* left берётся из --sidebar-w (=58) автоматически */
  #private-strip {
    width: 38px !important;
    padding: 56px 6px 16px !important;
    gap: 12px !important;
  }
  .strip-item { width: 18px !important; height: 26px !important; }
  .strip-divider { width: 22px !important; }

  /* ---- Нижняя полоса карты: ужимаем под узкий экран ---- */
  #map-bottom-bar { left: 96px !important; }       /* 58 (sidebar) + 38 (strip); !important — стиль из партиала грузится позже */
  #bb-coords-zone,
  #bb-attrib,
  #bb-weather-zone,
  #bb-north-btn { display: none !important; }      /* не влезает — прячем лишнее */
  #bb-search-zone { padding: 0 10px; }
}