/* Telegram Mini App - force mobile shell + iPhone safe areas (11–16 Pro) */

html.is-tg-miniapp {
  --ar-safe-top: env(safe-area-inset-top, 0px);
  --ar-safe-bottom: env(safe-area-inset-bottom, 0px);
  --ar-safe-left: env(safe-area-inset-left, 0px);
  --ar-safe-right: env(safe-area-inset-right, 0px);
  height: 100%;
  height: var(--tg-viewport-stable-height, 100%);
}

html.is-tg-miniapp,
html.is-tg-miniapp body {
  overflow: hidden;
  background: var(--tg-theme-bg-color, #f4f5f7);
  color: var(--tg-theme-text-color, inherit);
}

html.is-tg-miniapp body {
  margin: 0;
  padding: 0;
  height: 100%;
  height: var(--tg-viewport-stable-height, 100%);
  box-sizing: border-box;
}

html.is-tg-miniapp #app {
  height: 100%;
  min-height: 100%;
  box-sizing: border-box;
}

/* Always use mobile inbox layout (same as max-width: 960px). */
html.is-tg-miniapp .dashboard {
  height: 100%;
  min-height: 100%;
  box-sizing: border-box;
}

html.is-tg-miniapp .dashboard.is-mobile-chat .sidebar {
  display: none;
}

html.is-tg-miniapp .dashboard:not(.is-mobile-chat) .main-pane,
html.is-tg-miniapp .dashboard:not(.is-mobile-chat) #visitor-panel-slot {
  display: none;
}

html.is-tg-miniapp .dashboard.is-mobile-chat .main-pane {
  display: flex;
  width: 100%;
  max-width: none;
}

html.is-tg-miniapp .dashboard.is-mobile-info #visitor-panel-slot {
  display: flex;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 40;
  width: 100%;
  max-width: none;
  box-sizing: border-box;
  padding-top: var(--ar-safe-top);
  padding-bottom: var(--ar-safe-bottom);
  padding-left: var(--ar-safe-left);
  padding-right: var(--ar-safe-right);
  background: var(--tg-theme-bg-color, #fff);
}

html.is-tg-miniapp .dashboard.is-mobile-info .main-pane {
  display: none;
}

html.is-tg-miniapp .dashboard.is-mobile-info .visitor-panel-head {
  padding-top: 0.35rem !important;
}

html.is-tg-miniapp .chat-back-btn {
  display: inline-flex !important;
}

html.is-tg-miniapp .nav-mobile-open,
html.is-tg-miniapp #nav-mobile-open {
  display: inline-flex !important;
}

/*
 * Шапка / композер: отступ под Dynamic Island + кнопки Mini App.
 * Сбрасываем только env() из styles.css, чтобы не было двойного padding.
 */
html.is-tg-miniapp .sidebar-head,
html.is-tg-miniapp .chat-topbar,
html.is-tg-miniapp .settings-topbar {
  padding-top: max(0.65rem, var(--ar-safe-top)) !important;
  padding-left: max(0.75rem, var(--ar-safe-left)) !important;
  padding-right: max(0.75rem, var(--ar-safe-right)) !important;
  box-sizing: border-box;
}

html.is-tg-miniapp .compose {
  padding-bottom: max(0.65rem, var(--ar-safe-bottom)) !important;
  padding-left: max(0.75rem, var(--ar-safe-left)) !important;
  padding-right: max(0.75rem, var(--ar-safe-right)) !important;
  box-sizing: border-box;
}

html.is-tg-miniapp .mobile-search-sheet,
html.is-tg-miniapp .nav-drawer {
  padding-top: var(--ar-safe-top) !important;
  padding-bottom: var(--ar-safe-bottom) !important;
  padding-left: var(--ar-safe-left) !important;
  padding-right: var(--ar-safe-right) !important;
  box-sizing: border-box;
}

/* Login / register */
html.is-tg-miniapp .auth-shell,
html.is-tg-miniapp .login-page,
html.is-tg-miniapp .auth-card,
html.is-tg-miniapp .auth-layout {
  max-width: 100%;
  min-height: 100%;
  border-radius: 0;
  box-shadow: none;
  box-sizing: border-box;
  padding-top: max(1rem, var(--ar-safe-top)) !important;
  padding-bottom: max(1rem, var(--ar-safe-bottom)) !important;
  padding-left: max(1rem, var(--ar-safe-left)) !important;
  padding-right: max(1rem, var(--ar-safe-right)) !important;
}

html.is-tg-miniapp .btn-primary,
html.is-tg-miniapp button.primary {
  background: var(--tg-theme-button-color, var(--accent, #2a6df4));
  color: var(--tg-theme-button-text-color, #fff);
}

html.is-tg-miniapp a {
  color: var(--tg-theme-link-color, inherit);
}