/* Global chat layout utilities for all apps */
:root {
  /* Default header height - matches Tailwind h-16 (4rem) */
  --header-h: 4rem;
}

/* Make html and body fill height for consistent 100% sizing */
html,
body {
  height: 100%;
}

/* Viewport-height utility that subtracts the fixed header height.
   Uses dvh when available for mobile browsers, with vh fallback. */
@supports (height: 100dvh) {
  .layout-vh {
    height: calc(100dvh - var(--header-h));
    display: flex;
    flex-direction: row;
  }
}
@supports not (height: 100dvh) {
  .layout-vh {
    height: calc(100vh - var(--header-h));
    display: flex;
    flex-direction: row;
  }
}

/* Optional, but improves UX in scroll panes */
.chat-scroll {
  overscroll-behavior: contain;
  scroll-behavior: smooth;
}

/* Sidebar isolation to avoid vertical influence on main content row */
#sidebar {
  height: 100vh;
  overflow: hidden;
}
#sidebarContent {
  /* Adjust the subtraction if you need to account for internal side header paddings */
  height: calc(100vh - 2.5rem);
  overflow-y: auto;
  overflow-x: hidden;
}

/* Critical: Ensure chat input bar is always visible */
.layout-vh .flex-1 {
  min-height: 0;
  display: flex;
  flex-direction: column;
}

.layout-vh .flex-1 .flex-1 {
  min-height: 0;
  overflow-y: auto;
}

.layout-vh .flex-shrink-0 {
  flex-shrink: 0;
}