/* Мобильный слой вьювера (27.10.2026). Подключается ПОСЛЕ style.css; десктоп не меняет:
   всё ниже — только в медиа-запросах по узкой ширине / низкой высоте альбома / грубому указателю.
   Используется и dwgviewer.app (site/build.py дописывает <link> на этот файл, если движок его ещё не подключает).
   Что чинит: вертикальная полоса инструментов (.dxf-strip, js/viewer-tools.js) выше экрана телефона
   уходила за край (в альбоме 8 из 13 кнопок недоступны) и лежала поверх чертежа. */

/* ── Сенсорные экраны любой ширины ─────────────────────────────────────── */
@media (pointer: coarse) {
  /* пинч и перетаскивание холста — только чертежу (OrbitControls), не странице; без «потянуть для обновления» */
  #viewerContainer, #viewerContainer canvas { touch-action: none; }
  html, body { overscroll-behavior: none; }
  /* iOS увеличивает страницу при фокусе на поле мельче 16 px */
  .dxf-find-input { font-size: 16px; }
  /* панель рамки области: кнопки под палец */
  .dxf-region__btn { min-height: 44px; }
}

/* Высота: 100% у html/body в Safari = большой вьюпорт (под адресной строкой); dvh — видимая часть */
@media (max-width: 900px), (max-height: 500px) {
  #app { height: 100%; height: 100dvh; }
  .header { padding: 8px 12px; gap: 8px; }
  .logo { min-width: 0; font-size: 16px; line-height: 1.15; }   /* название переносится, но не обрезается */
  .header .nav { flex: none; gap: 6px; }
  .header .btn { white-space: nowrap; min-height: 40px; padding: 8px 12px; }
  /* панель слоёв: не шире экрана, шапку при открытой панели не сдвигаем за край */
  .layers-panel { width: min(280px, 85vw); }
  body.dxf-layers-open .layers-handle { right: min(280px, 85vw); }
  body.dxf-layers-open .nav { margin-right: 0; }
  .layers-panel .btn-close { min-width: 44px; min-height: 44px; }
  .layer-item { min-height: 40px; }
  .dxf-props { max-height: calc(100dvh - 160px); }
  .dxf-sidepanel { max-width: 100vw; }
  /* поиск текста: панель в пределах экрана (была шире 390 px), поле тянется */
  .dxf-findbar { left: 8px; right: 8px; transform: none; }
  .dxf-find-input { flex: 1; min-width: 0; width: auto; }
}

/* ── Телефон в портрете / узкое окно: полоса инструментов снизу, горизонтальная прокрутка ── */
@media (max-width: 600px) and (min-height: 501px) {
  #dxfToolStrip.dxf-strip {
    top: auto; left: 0; right: 0;
    bottom: var(--footer-h, 41px);
    transform: none;
    flex-direction: row; flex-wrap: nowrap; align-items: center;
    gap: 4px; padding: 6px 8px;
    overflow-x: auto; overflow-y: hidden;
    -webkit-overflow-scrolling: touch; scrollbar-width: none;
    border-radius: 0; border-left: 0; border-right: 0; border-bottom: 0;
    box-shadow: 0 -6px 18px rgba(0, 0, 0, 0.25);
  }
  .dxf-strip::-webkit-scrollbar { display: none; }
  .dxf-strip > * { flex: none; }
  .dxf-strip .dxf-stripbtn { width: 44px; height: 44px; }
  .dxf-strip__sep { width: 1px; height: 28px; margin: 0 2px; }
  /* холст заканчивается над полосой, а не под ней */
  .viewer-container { margin-bottom: 57px; }
  /* меню полосы (Export, «…») — над полосой во всю ширину; fixed, чтобы прокрутка полосы их не обрезала */
  .dxf-strip .dxf-menu__list, .dxf-strip .dxf-menu--up .dxf-menu__list {
    position: fixed; left: 8px; right: 8px; top: auto;
    bottom: calc(var(--footer-h, 41px) + 64px);
    max-height: 55dvh; overflow-y: auto;
  }
  .dxf-strip .dxf-menu__item { padding: 12px 14px; }
  .status-bar { flex-wrap: wrap; gap: 4px 12px; padding: 6px 12px; }
  .status-bar > span { white-space: nowrap; }
  #dxfShotTray { bottom: calc(var(--footer-h, 41px) + 66px); }
  .dxf-toast { bottom: calc(var(--footer-h, 41px) + 72px); }
  /* панель рамки области: док над полосой во всю ширину, не скачет за рамкой (JS ставит is-docked по тому же запросу) */
  .dxf-region.is-docked {
    position: fixed; left: 16px; right: 16px; top: auto;
    bottom: calc(var(--footer-h, 41px) + 57px + 8px);
    z-index: 1100;
  }
  .dxf-region.is-docked .dxf-region__btn { flex: 1 0 auto; min-height: 44px; padding: 6px 10px; }
}

/* самые узкие телефоны (SE): кнопки шапки плотнее, чтобы влез переключатель языка dwgviewer */
@media (max-width: 400px) {
  .header .nav { gap: 4px; }
  .header .btn { padding: 8px 10px; }
}

/* ── Десктоп / планшет невысокий (ноутбук 1366×768, 1280×720): полоса из 15 кнопок выше 786 px
   центрировалась по экрану (top:50% + translateY(-50%)) и вылезала за верх и низ, закрывая логотип и подвал.
   Здесь она стоит между шапкой и подвалом, по центру, кнопки ниже на 7 px, промежутки и поля меньше (1280×720 влезает без прокрутки); не влезла — прокрутка внутри полосы.
   transform снят, иначе fixed-меню внутри полосы привязались бы к ней и обрезались прокруткой.
   Экраны выше 900 px не меняются. */
@media (min-width: 601px) and (min-height: 501px) and (max-height: 900px) {
  #dxfToolStrip.dxf-strip {
    top: calc(var(--header-h, 57px) + 6px);
    bottom: calc(var(--footer-h, 35px) + 6px);
    transform: none;
    height: fit-content;
    max-height: calc(100vh - var(--header-h, 57px) - var(--footer-h, 35px) - 12px);
    margin: auto 0;
    gap: 3px; padding: 6px;
    overflow-y: auto; overflow-x: hidden;
    scrollbar-width: thin;
  }
  .dxf-strip > * { flex: none; }
  .dxf-strip .dxf-stripbtn { height: 35px; }
  /* меню полосы (Export, «…») — fixed справа от полосы под шапкой: прокрутка полосы их не обрезает */
  .dxf-strip .dxf-menu__list, .dxf-strip .dxf-menu--up .dxf-menu__list {
    position: fixed; left: 80px; right: auto; bottom: auto;
    top: calc(var(--header-h, 57px) + 6px);
    max-height: calc(100vh - var(--header-h, 57px) - var(--footer-h, 35px) - 12px); overflow-y: auto;
  }
}

/* ── Телефон в альбоме (низкий экран): шапка и подвал компактнее, полоса — между ними с прокруткой ── */
@media (max-height: 500px) and (orientation: landscape) {
  .header { padding: 4px 12px; }
  .header .btn { min-height: 36px; padding: 6px 12px; }
  .status-bar { flex-wrap: nowrap !important; overflow-x: auto; white-space: nowrap; gap: 16px; padding: 4px 12px; scrollbar-width: none; }
  .status-bar::-webkit-scrollbar { display: none; }
  .status-bar > * { flex: none; }
  #dxfToolStrip.dxf-strip {
    left: 6px;
    top: calc(var(--header-h, 52px) + 6px);
    bottom: calc(var(--footer-h, 30px) + 6px);
    transform: none;
    gap: 2px; padding: 6px 4px;
    overflow-y: auto; overflow-x: hidden;
    -webkit-overflow-scrolling: touch; scrollbar-width: none;
    justify-content: flex-start;
  }
  .dxf-strip::-webkit-scrollbar { display: none; }
  .dxf-strip > * { flex: none; }
  .dxf-strip .dxf-stripbtn { width: 44px; height: 40px; }
  /* холст правее полосы, а не под ней */
  .viewer-container { margin-left: 62px; }
  .dxf-strip .dxf-menu__list, .dxf-strip .dxf-menu--up .dxf-menu__list {
    position: fixed; left: 66px; right: auto; bottom: auto;
    top: calc(var(--header-h, 52px) + 6px);
    max-height: calc(100dvh - var(--header-h, 52px) - var(--footer-h, 30px) - 12px); overflow-y: auto;
  }
}