/* ================================================================
   Модуль «Локации» — клиентские стили (отдельный файл модуля).
   Карта и объекты используют классы bk2 (eloc_bg/eloc_obj/eloc_shadow*,
   links_a, rm_btns_a, MoveLine) — их правила лежат в static/css/buttons.css
   и static/css/main.css. Здесь только дополнения модуля: бокс масштабирования
   карты, экран выбора локации, свободные перемещения, страница предметов.
   ================================================================ */

/* Бокс карты: карта имеет фиксированную ширину макета (bg.w), на узком
   экране сжимается через transform (location.js relayout). Карта прижата
   к правому краю колонки (как в bk2): ширина задаётся в JS, а auto-margin
   слева прижимает блок вправо. */
.loc-map-box {
  position: relative;
  overflow: hidden;
  min-width: 0;
  max-width: 100%;
  contain: inline-size;
  margin-left: auto;
  margin-right: 0;
}

/* --- трёхколоночная раскладка комнаты (как bk2 htmlRoom):
   слева панели «Персонаж» и «Характеристики:» (заполняются модулями
   info и stats — bk.inf.myInfo(1) / bk.inf.myStats(2)),
   справа — карта со всеми элементами.
   table-layout:fixed — чтобы фиксированные ширины полос под картой
   не растягивали таблицу на узких экранах (min-content не учитывается). --- */
.loc-room-table { width: 100%; table-layout: fixed; }
.loc-cell-map { width: 100%; }
.loc-room-right { text-align: right; }
.loc-room-right .loc_links_bar,
.loc-room-right .loc_title_line {
  display: block;
  margin-left: auto;
  margin-right: 0;
  max-width: 100%;
  box-sizing: border-box;
}
.loc-panel {
  background: #fff;
  border: 1px solid #c8c8c8;
  border-radius: 4px;
  padding: 0.5rem 0.625rem;
  font-size: 0.8rem;
  color: #333;
  box-sizing: border-box;
  margin-bottom: 0.5rem;
}
.loc-panel-title { font-weight: bold; color: #555; }
.loc-panel-body { min-height: 9rem; }
.loc-stats {
  zoom: var(--sizerem, 1);
  font-size: 10pt;
  line-height: 1.25;
}
.loc-stats small { font-size: 0.88em; }
.loc-stats * { --sizerem: 1; }
.loc-panel-pers { padding: 2px; }

/* Слои подсветки eloc_shadow1…5 — вложенные копии изображения объекта.
   В bk2 они задуманы как наложенные слои (JS вешает на них drop-shadow
   по уровням: ahover/bhover/objHoverAll), поэтому слои кладём точно
   поверх объекта; разметка при этом остаётся 1:1 с bk2. */
.eloc_obj > [class^="eloc_shadow"] {
  position: absolute;
  top: 0;
  left: 0;
}

.online_x { color: #8a2b2b; font-weight: bold; }

/* --- загрузка / ошибки --- */
.loc-root {
  display: grid;
  grid-template-columns: minmax(11rem, 15rem) minmax(0, 1fr);
  gap: 0.75rem;
  padding: 0.375rem;
  align-items: start;
}
.loc-info {
  background: #fff;
  border: 1px solid #c8c8c8;
  border-radius: 4px;
  padding: 0.5rem 0.625rem;
  font-size: 0.8rem;
  color: #333;
  box-sizing: border-box;
}
.loc-error { display: none; color: #8f0000; font-weight: bold; font-size: 0.85rem; padding: 0.2rem 0; }
.loc-error.on { display: block; }

/* --- предметы на локации (страница itemsloc) --- */
.itmloc-error {
  display: none;
  color: #8f0000;
  font-weight: bold;
  font-size: 0.85rem;
}

/* --- выбор локации (когда игрок не в комнате каталога / пустой каталог) --- */
.loc-picker { display: grid; grid-template-columns: repeat(auto-fill, minmax(13rem, 1fr)); gap: 0.5rem; }
.loc-pick {
  background: #fff; border: 1px solid #c8c8c8; border-radius: 4px;
  padding: 0.6rem 0.7rem; cursor: pointer; font-size: 0.8rem; color: #333;
}
.loc-pick:hover { border-color: #8a2b2b; }
.loc-pick .t { font-weight: bold; font-size: 0.85rem; }
.loc-pick .d { color: #666; font-size: 0.75rem; margin-top: 0.2rem; }
.loc-pick .on { color: #8a2b2b; font-size: 0.75rem; margin-top: 0.25rem; }
.loc-free { background: #fff; border: 1px solid #c8c8c8; border-radius: 4px; padding: 0.75rem; font-size: 0.8rem; }
.loc-free .row { display: flex; flex-wrap: wrap; gap: 0.4rem; align-items: center; margin-top: 0.5rem; }
.loc-free input { height: 1.7rem; padding: 0 0.4rem; border: 1px solid #b5b5b5; border-radius: 3px; box-sizing: border-box; }

/* --- мобильная версия (<900px, не принудительный десктоп) --- */
@media (max-width: 899px) {
  html:not(.mpg-force-desktop) .loc-root { display: flex; flex-direction: column; }
  html:not(.mpg-force-desktop) .loc-picker { grid-template-columns: 1fr 1fr; }
  html:not(.mpg-force-desktop) .loc-free .row input { flex: 1 1 100%; }
  /* панели-заглушки слева скрываются — карта занимает всю ширину */
  html:not(.mpg-force-desktop) .loc-cell-pers,
  html:not(.mpg-force-desktop) .loc-cell-stats { display: none; }
}
@media (max-width: 420px) {
  html:not(.mpg-force-desktop) .loc-picker { grid-template-columns: 1fr; }
}
