:root {
  --search-top: 100px;   /* bottom edge of the server title + ~8px */
  --search-h: 44px;
  --search-gap: 12px;
  --footer-h: 110px;
}

/* Pack columns to the left */
body.layout-multiple-columns main[class*="multi_column__root"] {
  justify-content: flex-start;
}

/* Collapse the discovery column to nothing (its children float free) */
body.layout-multiple-columns [class*="multi_column__discoveryColumn"] {
  flex: 0 0 0 !important;
  width: 0 !important;
  min-width: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  overflow: visible !important;
}

body.layout-multiple-columns [class*="discovery_panel__root"] {
  display: contents;
}

/* Search: under the server title, over the menu panel */
body.layout-multiple-columns [class*="discovery_panel__root"] > form.search {
  position: fixed;
  top: var(--search-top);
  left: 12px;
  width: 260px;          /* menu panel width minus padding */
  height: var(--search-h);
  z-index: 5;
}

/* Push the menu links down to make room for the search */
body.layout-multiple-columns nav[class*="navigation_panel_redesign__root"] > :nth-child(3) {
  margin-top: calc(var(--search-h) + var(--search-gap));
}

/* Posts column (the one just before discovery): anchor for the footer,
   with room left at its bottom */
body.layout-multiple-columns [class*="column__root"]:has(+ [class*="discoveryColumn"]) {
  anchor-name: --posts-col;
  padding-bottom: var(--footer-h);
  box-sizing: border-box;
}

/* Footer: pinned to the bottom of the posts column, same width */
body.layout-multiple-columns [class*="discovery_panel__root"] > footer {
  position: fixed;
  position-anchor: --posts-col;
  left: anchor(left);
  bottom: anchor(bottom);
  width: anchor-size(width);
  height: var(--footer-h);
  overflow: auto;
  z-index: 5;
}

:root {
  --composer-h: 300px;   /* tweak: height of the docked composer */
  --composer-gap: 8px;
}

@media (min-width: 1500px) {   /* tweak: raise to switch off at lower zoom */

  /* The wrapper no longer takes up a column of its own */
  body.layout-multiple-columns [class*="compose_trigger__root"] {
    display: contents;
  }

  /* New post button: anchor point, plus reserved space below it */
  body.layout-multiple-columns [class*="navigation_panel_redesign__newPostButton"] {
    anchor-name: --newpost;
  }

  body.layout-multiple-columns main:has(form[class*="compose_trigger__composer"])
    [class*="navigation_panel_redesign__newPostButton"] {
    margin-bottom: calc(var(--composer-h) + var(--composer-gap));
  }

  /* Composer: floats under the New post button, same width as the menu */
  body.layout-multiple-columns form[class*="compose_trigger__composer"] {
    position: fixed !important;
    position-anchor: --newpost;
    top: calc(anchor(bottom) + var(--composer-gap)) !important;
    left: anchor(left) !important;
    width: anchor-size(width) !important;
    height: var(--composer-h) !important;
    inset-block-end: auto !important;
    inset-inline-end: auto !important;
    transform: none !important;
    overflow-y: auto;
    box-shadow: none !important;
    z-index: 5 !important;
  }
}

