/* ═══════════════════════════════════════════════════════════════════════════
   app-views.css — вкладки приложения (static/js/app-views.js).
   ═══════════════════════════════════════════════════════════════════════════ */

/* Область вкладок: между шапкой и нижним меню. Отступы ставит скрипт. */
.app-views {
  position: fixed;
  left: 0; right: 0; top: 0; bottom: 0;
  z-index: 1020;                 /* под шапкой (1030) и меню (2000) */
  background: var(--bg);
  overflow: hidden;
}
.app-views[hidden] { display: none; }
.app-view {
  position: absolute;
  inset: 0;
  width: 100%; height: 100%;
  border: 0;
  background: var(--bg);
  visibility: hidden;            /* скрытая рамка уже разложена — показ мгновенный */
  pointer-events: none;
}
.app-view.is-shown { visibility: visible; pointer-events: auto; }
.app-view.is-buffer { visibility: hidden; }
.app-view-skeleton {
  position: absolute;
  inset: 0;
  overflow: hidden;
  background: var(--bg);
  z-index: 1;
  transition: opacity var(--dur) var(--ease-out);
}
.app-view-skeleton.is-leaving { opacity: 0; }
.app-view-skeleton.is-hidden { display: none; }

/* Шапка — над вкладкой: её меню (колокольчик, ☰) раскрываются поверх.
   Без position z-index не действует. */
.view-open .app-top { position: relative; }

/* Пока открыта вкладка, расписание под ней не прокручивается. */
.view-open, .view-open body { overflow: hidden; }

/* Сдвиг экранов: уходящий — в сторону, приходящий — с другой. */
@keyframes view-in-left   { from { opacity: 0; transform: translateX(40px); } }
@keyframes view-in-right  { from { opacity: 0; transform: translateX(-40px); } }
@keyframes view-out-left  { to   { opacity: 0; transform: translateX(-40px); } }
@keyframes view-out-right { to   { opacity: 0; transform: translateX(40px); } }
.view-in-left   { animation: view-in-left   var(--dur-slow) var(--ease-out); }
.view-in-right  { animation: view-in-right  var(--dur-slow) var(--ease-out); }
.view-out-left  { animation: view-out-left  var(--dur) var(--ease-in-out) forwards; }
.view-out-right { animation: view-out-right var(--dur) var(--ease-in-out) forwards; }

/* Страница внутри рамки: без своей шапки, меню и номера версии — их
   показывает приложение. Класс ставит base.html до отрисовки. */
.embedded .app-top, .embedded .mobile-nav, .embedded .app-version { display: none !important; }
.embedded body { padding-bottom: var(--sp-3) !important; }