/* UZWay Messenger / external shared-header integration.
   Deliberately do not reset the shared header, its links or its controls. */

/* Tailwind 4 fallback was previously packed in place of the original CDN
   Tailwind 3. Keep the old Messenger palette scoped to the application; the
   standalone UZWay header continues to use its own color tokens. */
#messengerView, #authView, .app-modal {
  --color-gray-50: #f9fafb;
  --color-gray-100: #f3f4f6;
  --color-gray-200: #e5e7eb;
  --color-gray-300: #d1d5db;
  --color-gray-400: #9ca3af;
  --color-gray-500: #6b7280;
  --color-gray-600: #4b5563;
  --color-gray-700: #374151;
  --color-gray-800: #1f2937;
  --color-gray-900: #111827;
  --color-emerald-50: #ecfdf5;
  --color-emerald-100: #d1fae5;
  --color-emerald-200: #a7f3d0;
  --color-emerald-300: #6ee7b7;
  --color-emerald-400: #34d399;
  --color-emerald-500: #10b981;
  --color-emerald-600: #059669;
  --color-emerald-700: #047857;
  --color-emerald-800: #065f46;
  --color-emerald-900: #064e3b;
}

/* The shared header ships its dashboard sheet outside the Messenger markup.
   Its initial hidden state must work even when its own remote CSS is blocked
   or cached incorrectly. The standalone mobile sheet remains usable. */
body > .pmm-panel:not(.is-open),
body > .pmm-overlay:not(.is-open) {
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
  position: fixed !important;
}

/* The external header renders these controls even on the Messenger desktop
   route (it hides the desktop nav). They must not enter document flow. */
@media (min-width: 1024px) {
  body > .pmm-panel,
  body > .pmm-overlay,
  body > .people-bottom-nav,
  body > .uzm-bottom.people-bottom-nav {
    display: none !important;
  }

  /* #mobileMain is display:contents on desktop: its order utilities no
     longer affect #workspace, which becomes a direct flex child. Explicit
     orders prevent the Chats column from preceding the sidebar. */
  #messengerView.is-visible {
    display: flex !important;
    flex-direction: row !important;
    height: 100dvh;
    min-height: 0;
    width: 100%;
  }
  #messengerView > #desktopSidebar {
    order: 0 !important;
    flex: 0 0 16rem;
    min-width: 0;
    height: 100%;
  }
  #messengerView #workspace {
    order: 1 !important;
    flex: 1 1 0%;
    min-width: 0;
    min-height: 0;
    height: 100%;
  }
}

@media (max-width: 1023px) {
  /* Messenger has its own bottom navigation: don't overlay it with the
     shared site's separate bottom bar on this specific app route. */
  body > .people-bottom-nav,
  body > .uzm-bottom.people-bottom-nav {
    display: none !important;
  }
  #messengerView.is-visible {
    height: 100dvh;
    min-height: 0;
  }
}