/* Режим планшета. Все правила только под html.tablet (класс ставит tablet.js), вид на компьютере не меняется. */

html.tablet body { font-size: 15px; touch-action: manipulation; -webkit-tap-highlight-color: rgba(47, 198, 246, .25); }

/* высота экрана без панелей браузера: 100vh на планшете больше видимой области */
html.tablet #app, html.tablet .screen { min-height: 100dvh; }
html.tablet .sticky-wrap, html.tablet .db-scroll { max-height: calc(100dvh - 130px); }
html.tablet .rp-list { max-height: calc(100dvh - 170px); }
html.tablet .rp-frame { height: calc(100dvh - 170px); }
html.tablet .np { max-height: calc(100dvh - 80px); }
html.tablet .order-modal { width: calc(100vw - 16px); height: calc(100dvh - 16px); }

/* меню: выезжающая панель вместо постоянной колонки, ширина страницы остается таблицам */
html.tablet .sidebar {
  position: fixed; left: 0; top: 0; height: 100dvh; width: 300px; flex: none; transform: translateX(-105%);
  transition: transform .22s ease; box-shadow: var(--shadow); background: rgba(10, 13, 48, .96);
}
html.tablet .sidebar.open { transform: none; }
/* панель прокручивается целиком: на 768 px по высоте нижние пункты не должны сжимать список разделов */
html.tablet .sidebar { overflow-y: auto; overscroll-behavior: contain; }
html.tablet .side-nav { flex: none; overflow: visible; }
html.tablet .side-foot { margin-top: auto; }
html.tablet .menu-btn { display: inline-flex; }
html.tablet .nav-item, html.tablet .side-link { min-height: 48px; font-size: 16px; align-items: center; }
html.tablet .side-user { min-height: 52px; }

/* шапка */
html.tablet .topbar { padding: 8px 12px; gap: 10px; }
html.tablet .qsearch kbd { display: none; }
html.tablet .qsearch input { padding: 11px 0; }
html.tablet .icon-btn { min-width: 44px; min-height: 44px; }
html.tablet .mode select { min-height: 44px; }
html.tablet main { padding: 14px 12px 60px; }
html.tablet main.wide { padding-bottom: 12px; }

/* размер касания: кнопка от 44 px, поле от 44 px; шрифт поля 16 px, иначе iPad увеличивает страницу при вводе */
html.tablet .btn-green, html.tablet .btn-ghost, html.tablet .ptabs button, html.tablet .seg button, html.tablet .cf-btns button { min-height: 44px; }
html.tablet .btn-small, html.tablet .chip-btn, html.tablet .btn-make { min-height: 40px; }
html.tablet .rp-item { min-height: 44px; }
html.tablet .link-btn { display: inline-flex; align-items: center; min-height: 36px; }
html.tablet input:not([type=checkbox]):not([type=radio]):not([type=file]), html.tablet select, html.tablet textarea { min-height: 44px; font-size: 16px; }
html.tablet input[type=checkbox], html.tablet input[type=radio] { width: 22px; height: 22px; }
html.tablet .x { min-width: 44px; min-height: 44px; font-size: 32px; }
/* стрелки сортировки и раскрытия: область нажатия больше значка, высота строки таблицы не меняется */
html.tablet .ct-tog, html.tablet .sort-arr, html.tablet .toggle { position: relative; }
html.tablet .ct-tog::after, html.tablet .sort-arr::after, html.tablet .toggle::after { content: ""; position: absolute; inset: -12px; }

/* таблицы и окна */
html.tablet .tbl th, html.tablet .tbl td { padding: 11px 10px; }
html.tablet .table-wrap, html.tablet .sticky-wrap, html.tablet .db-scroll, html.tablet .modal { overscroll-behavior: contain; -webkit-overflow-scrolling: touch; }
html.tablet .modal { padding: 12px 8px; background: rgba(5, 6, 30, .9); } /* страница под окном не просвечивает сквозь текст */
html.tablet .modal-body { padding: 16px; }