/* Apply the same full-width studio frame to the dashboard and every subpage. */
.admin:has(.editor-shell) {
  background: #f5f7f9;
  color: #142737;
}

.admin:has(.editor-shell) .admin-main {
  max-width: none;
  padding: 0;
}

/* The sidebar is taken out of flow (position: fixed), so the remaining grid
   child would otherwise be auto-placed into the first 250px column and end up
   underneath the menu. Pin it to the second column explicitly. */
.admin:has(.editor-shell) .editor-main {
  grid-column: 2;
}

.admin:has(.editor-shell) .editor-sidebar {
  /* The workspace menu is a persistent control, not content that scrolls away. */
  position: fixed;
  top: 72px;
  bottom: 0;
  width: 250px;
  min-height: 0;
  overflow-y: auto;
  z-index: 10;
  /* Align with the centred 1600px studio column. `50%` resolves against the
     viewport minus the scrollbar, exactly like the centred shell, whereas
     `100vw` includes the scrollbar and would drift ~7px whenever a long page
     brings the scrollbar in or out. */
  left: max(0px, calc(50% - 800px));
}

@media (max-width: 1050px) and (min-width: 721px) {
  .admin:has(.editor-shell) .editor-sidebar {
    width: 210px;
  }
}

@media (max-width: 720px) {
  .admin:has(.editor-shell) .editor-sidebar {
    position: static;
    width: auto;
    height: auto;
    overflow: visible;
  }
}
