/* app.css — оформление того, что добавляет мобильная версия:
   полоса «установите приложение» и нижняя панель вкладок. */

.pwa-install {
  position: fixed;
  left: 12px; right: 12px; bottom: calc(12px + env(safe-area-inset-bottom));
  z-index: 300;
  display: flex; align-items: center; gap: 10px;
  padding: 12px 14px;
  border-radius: 16px;
  background: #ffffff;
  border: 1px solid #dde6f7;
  box-shadow: 0 14px 40px rgba(31, 61, 122, .18);
  font-family: 'Manrope', 'Segoe UI', system-ui, sans-serif;
  font-size: 13.5px; line-height: 1.35; color: #24334d;
}
.pwa-install__text { flex: 1; }
.pwa-install__go {
  flex: none; cursor: pointer;
  padding: 9px 14px; border: 0; border-radius: 11px;
  background: #5b5bd6; color: #fff;
  font: inherit; font-weight: 700;
}
.pwa-install__close {
  flex: none; cursor: pointer;
  width: 28px; height: 28px; padding: 0;
  border: 0; border-radius: 9px; background: #eef2fb;
  color: #5b7190; font-size: 18px; line-height: 1;
}

/* Нижняя панель вкладок: только на телефоне и только в кабинете.
   На широком экране остаётся обычное боковое меню. */
.tabbar { display: none; }

@media (max-width: 760px) {
  .tabbar {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 250;
    display: flex;
    padding: 6px 4px calc(6px + env(safe-area-inset-bottom));
    background: rgba(255, 255, 255, .96);
    backdrop-filter: blur(10px);
    border-top: 1px solid #e4ecff;
  }
  .tabbar__item {
    flex: 1;
    display: flex; flex-direction: column; align-items: center; gap: 3px;
    padding: 6px 2px;
    text-decoration: none;
    color: #5b7190;
    font-family: 'Manrope', 'Segoe UI', system-ui, sans-serif;
    font-size: 11px; font-weight: 600;
  }
  .tabbar__item svg { width: 22px; height: 22px; display: block; }
  .tabbar__item[aria-current="page"] { color: #5b5bd6; }

  /* Чтобы панель не накрывала последний блок страницы. */
  body.has-tabbar .main { padding-bottom: 92px; }
  .pwa-install { bottom: calc(76px + env(safe-area-inset-bottom)); }
}

/* Съёмка документа камерой. Кнопку добавляет app.js — только на
   устройствах с сенсорным экраном и только к полям, принимающим фото. */
.camera-btn {
  display: inline-flex; align-items: center; gap: 7px;
  margin-top: 10px;
  padding: 9px 14px;
  cursor: pointer;
  border: 1px solid #dde6f7; border-radius: 12px;
  background: #f4f7ff; color: #3b4f70;
  font-family: 'Manrope', 'Segoe UI', system-ui, sans-serif;
  font-size: 13.5px; font-weight: 700;
}
.camera-btn::before {
  content: ""; width: 16px; height: 16px; flex: none;
  background: currentColor;
  -webkit-mask: var(--camera-icon) center / contain no-repeat;
  mask: var(--camera-icon) center / contain no-repeat;
}
:root {
  --camera-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linejoin='round'%3E%3Cpath d='M3 8h3l2-3h8l2 3h3v11H3z'/%3E%3Ccircle cx='12' cy='13' r='3.5'/%3E%3C/svg%3E");
}
.camera-btn:active { background: #e9efff; }