/* ═══════════════════════════════════════════════
   شَيِّد - أنماط وضع التطبيق
   ═══════════════════════════════════════════════ */

/* ─── وضع التطبيق: إخفاء الفوتر فقط (الهيدر يتحوّل لشريط علوي) ─── */
.app-mode #footer-mount,
.app-mode footer.site-footer {
  display: none !important;
}

/* الشريط العلوي للتطبيق يظهر (يُبنى عبر header.js) */
.app-mode .app-topbar-bar {
  display: flex !important;
}

/* وضع التطبيق: الشريط السفلي يظهر دائماً (حتى على الشاشات الكبيرة) */
.app-mode #bottomNav {
  display: block !important;
}

/* وضع التطبيق: مساحة علوية آمنة (notch) */
.app-mode body {
  padding-top: env(safe-area-inset-top, 0px);
}

/* وضع التطبيق: إخفاء زر تثبيت PWA (مثبّت أصلاً) */
.app-mode #installBanner {
  display: none !important;
}

/* وضع التطبيق: إخفاء زر واتساب العائم (نستبدله بشي داخلي لاحقاً) */
.app-mode .floating-chat {
  bottom: 5rem !important;
}

/* ─── شريط علوي بسيط للتطبيق (عنوان الصفحة فقط) ─── */
.app-topbar {
  display: none;
}
.app-mode .app-topbar {
  display: flex;
  align-items: center;
  justify-content: center;
  position: sticky;
  top: 0;
  z-index: 30;
  height: 52px;
  background: #FAF7F0;
  border-bottom: 1px solid #E5DFD3;
  font-weight: 800;
  font-size: 1rem;
  padding-top: env(safe-area-inset-top, 0px);
}

/* ─── وضع الويب: الشريط السفلي يختفي على الشاشات الكبيرة فقط ─── */
/* (السلوك الافتراضي md:hidden موجود في bottomnav) */

/* iOS: منع التكبير عند النقر على input */
.os-ios input, .os-ios select, .os-ios textarea {
  font-size: 16px !important;
}

/* تحسين اللمس */
.app-mode a, .app-mode button {
  -webkit-tap-highlight-color: transparent;
}