/*
 * Telegram Mini App theme overrides.
 *
 * Applied when body has class "tma" (set by tg-bridge.js).
 * Maps Telegram theme variables to app CSS variables.
 */

/* ===== Theme variable mapping ===== */
body.tma {
  --bg: var(--tg-bg, #ffffff);
  --bg2: var(--tg-secondary-bg, #f5f5f5);
  --text: var(--tg-text, #1a1a1a);
  --text2: var(--tg-hint, #8e8e93);
  --text3: var(--tg-subtitle, #8e8e93);
  --accent: var(--tg-link, #007aff);
  --border: var(--tg-secondary-bg, #e5e5ea);

  background: var(--bg);
  color: var(--text);
}

/* ===== Hide header (Telegram provides its own) ===== */
body.tma .hdr {
  display: none;
}

.tma-search {
  display: none;
}

body.tma .tma-search {
  display: flex !important;
}

/* ===== Hide bottom nav (BackButton replaces it) ===== */
body.tma .nav {
  display: none;
}

/* ===== Hide custom back buttons ===== */
body.tma .back-btn {
  display: none;
}

/* ===== Remove bottom padding (no nav bar) ===== */
body.tma {
  padding-bottom: 0;
  overscroll-behavior: none;
}

/* ===== Safe area insets for iOS ===== */
body.tma {
  padding-top: env(safe-area-inset-top, 0);
  padding-left: env(safe-area-inset-left, 0);
  padding-right: env(safe-area-inset-right, 0);
  padding-bottom: env(safe-area-inset-bottom, 0);
}

/* ===== Card backgrounds use secondary bg ===== */
body.tma .card,
body.tma .pc,
body.tma .cart-group,
body.tma .checkout-section,
body.tma .profile-card,
body.tma .stat-card,
body.tma .profile-menu-item,
body.tma .payment-card,
body.tma .slot-card {
  background: var(--tg-secondary-bg, var(--bg2));
}

/* ===== Buttons use Telegram accent colors ===== */
body.tma .btn-primary {
  background: var(--tg-btn, var(--accent));
  color: var(--tg-btn-text, #ffffff);
}

/* ===== Section headers ===== */
body.tma .page-title,
body.tma h3 {
  color: var(--tg-section-header, var(--text));
}

/* ===== Links ===== */
body.tma a {
  color: var(--tg-link, var(--accent));
}

/* ===== Logout/destructive text ===== */
body.tma .logout-item span {
  color: var(--tg-destructive, #ff3b30);
}

/* ===== Toast in TMA gets slight adjustment ===== */
body.tma .toast-container {
  top: env(safe-area-inset-top, 12px);
}

/* ===== Hide login-related UI in TMA ===== */
body.tma .login-page,
body.tma .account-switch-btn {
  display: none;
}

/* ===== Chat TMA overrides ===== */
body.tma .chat-page { height: 100vh; }
body.tma .chat-bubble-support { background: var(--tg-secondary-bg, var(--bg2)); }
body.tma .chat-input-area { background: var(--tg-bg, var(--bg)); }
body.tma .chat-input-wrap { background: var(--tg-secondary-bg, var(--bg2)); }

/* ===== Admin panel TMA overrides ===== */
/* Админ-нав НЕ скрываем в TMA: BackButton возвращает домой, а не переключает
   между админ-страницами. Без .adm-nav админ в TMA-mobile залипал на странице. */
body.tma.adm-page { padding-bottom: calc(60px + env(safe-area-inset-bottom)); }
body.tma .adm-nav { background: var(--tg-bg, var(--bg)); backdrop-filter: none; -webkit-backdrop-filter: none; }
body.tma .adm-header { background: var(--tg-bg, var(--bg)); }
body.tma .adm-stat { background: var(--tg-secondary-bg, var(--bg2)); }
body.tma .adm-user-card:hover { background: var(--tg-secondary-bg, var(--bg2)); }
body.tma .adm-quick { border-color: var(--tg-secondary-bg, var(--border)); }
body.tma .adm-owner-card { background: var(--tg-secondary-bg, var(--bg2)); }
body.tma .adm-add-form { border-color: var(--tg-secondary-bg, var(--border)); }
body.tma .adm-add-form input { background: var(--tg-secondary-bg, var(--bg2)); border-color: var(--tg-secondary-bg, var(--border)); }