/* Embed AiProjectBuilderView inside #boxiesContent — Shell keeps header/sidebar/dock. */

#boxiesContent.boxies-builder-embed,
#boxiesContent.is-builder-embed {
  position: relative;
}

#boxiesContent .boxies-builder-embed,
.boxies-builder-embed {
  position: relative;
  min-height: calc(100vh - var(--boxies-header-h, 52px) - var(--boxies-dock-h, 56px) - var(--boxies-dock-safe, 0px));
}

/* Nested chrome removed in JS; CSS is a safety net */
.boxies-builder-embed .builder-header-fixed,
.boxies-builder-embed .builder-dock,
#boxiesContent .builder-header-fixed,
#boxiesContent > .builder-dock {
  display: none !important;
}

.boxies-builder-embed .builder-app,
#boxiesContent .builder-app {
  position: relative;
  min-height: 0;
}

.boxies-builder-embed .builder-progress-sidebar,
#boxiesContent .builder-progress-sidebar {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  z-index: 2;
  width: var(--builder-rail-width, 200px);
  height: auto;
  transition: width 0.28s cubic-bezier(0.22, 1, 0.36, 1);
  padding-top: var(--boxies-chrome-pad-top, 12px);
}

.boxies-header__actions {
  gap: 6px;
}

.boxies-builder-embed .builder-workspace,
#boxiesContent .builder-workspace {
  margin-top: 0;
  margin-left: var(--builder-rail-width, 200px);
  min-height: calc(100vh - var(--boxies-header-h, 52px) - var(--boxies-dock-h, 56px) - var(--boxies-dock-safe, 0px));
  transition: margin-left 0.28s cubic-bezier(0.22, 1, 0.36, 1);
}

.boxies-builder-embed .builder-workspace .builder-main-panel,
#boxiesContent .builder-workspace .builder-main-panel {
  min-height: calc(100vh - var(--boxies-header-h, 52px) - var(--boxies-dock-h, 56px) - var(--boxies-dock-safe, 0px));
}

.boxies-builder-embed #builderStepPanel,
#boxiesContent #builderStepPanel {
  min-height: calc(100vh - var(--boxies-header-h, 52px) - var(--boxies-dock-h, 56px) - var(--boxies-dock-safe, 0px));
  max-height: none;
  padding: 24px clamp(20px, 3vw, 40px) 28px;
}

/*
 * Frame lock — use single-level :has() only.
 * Nested :has(#id:has(...)) is rejected by the selector engine and drops the whole rule,
 * which lets the shell grow with content and kills workspace scrolling.
 */
.boxies-workspace:has(.builder-step-content--hero),
.boxies-workspace__panel:has(.builder-step-content--hero),
.boxies-workspace:has(.builder-step-content--estructura),
.boxies-workspace__panel:has(.builder-step-content--estructura) {
  height: calc(
    100vh - var(--boxies-header-h, 52px) - var(--boxies-dock-h, 56px) - var(--boxies-dock-safe, 0px)
  );
  max-height: calc(
    100vh - var(--boxies-header-h, 52px) - var(--boxies-dock-h, 56px) - var(--boxies-dock-safe, 0px)
  );
  min-height: 0;
  overflow: hidden;
}

#boxiesContent.boxies-builder-embed:has(.builder-step-content--hero),
#boxiesContent.is-builder-embed:has(.builder-step-content--hero),
#boxiesContent.boxies-builder-embed:has(.builder-step-content--estructura),
#boxiesContent.is-builder-embed:has(.builder-step-content--estructura) {
  display: flex;
  flex-direction: column;
  height: 100%;
  max-height: 100%;
  min-height: 0 !important;
  overflow: hidden;
  padding: 0;
}

#boxiesContent:has(.builder-step-content--hero) .builder-app,
#boxiesContent:has(.builder-step-content--estructura) .builder-app {
  flex: 1 1 0%;
  min-height: 0;
  height: 100%;
  max-height: 100%;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  position: relative;
}

/* Hero: workspace is a non-scrolling frame; columns scroll inside */
#boxiesContent:has(.builder-step-content--hero) .builder-workspace,
.boxies-builder-embed:has(.builder-step-content--hero) .builder-workspace {
  flex: 1 1 0%;
  min-height: 0 !important;
  height: 100%;
  max-height: 100%;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

#boxiesContent:has(.builder-step-content--hero) .builder-main-panel,
.boxies-builder-embed:has(.builder-step-content--hero) .builder-main-panel {
  flex: 1 1 0%;
  min-height: 0 !important;
  height: 100%;
  max-height: 100%;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

#boxiesContent:has(.builder-step-content--hero) #builderStepPanel,
.boxies-builder-embed:has(.builder-step-content--hero) #builderStepPanel {
  flex: 1 1 0%;
  min-height: 0 !important;
  height: 100% !important;
  max-height: 100% !important;
  overflow: hidden !important;
  display: flex;
  flex-direction: column;
  padding: 14px clamp(16px, 2.4vw, 28px) 10px;
  box-sizing: border-box;
}

/*
 * V5.9.4 — Estructura: ONLY .builder-workspace scrolls (far-right scrollbar).
 * Must NOT share overflow:hidden with Hero. Children grow; they do not scroll.
 */
#boxiesContent:has(.builder-step-content--estructura) .builder-workspace,
.boxies-builder-embed:has(.builder-step-content--estructura) .builder-workspace {
  flex: 1 1 0%;
  min-height: 0 !important;
  height: 100% !important;
  max-height: 100% !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain;
  display: block !important;
  box-sizing: border-box;
  scrollbar-gutter: stable;
  scrollbar-width: thin;
  scrollbar-color: rgba(255, 255, 255, 0.16) transparent;
}

#boxiesContent:has(.builder-step-content--estructura) .builder-workspace::-webkit-scrollbar,
.boxies-builder-embed:has(.builder-step-content--estructura) .builder-workspace::-webkit-scrollbar {
  width: 5px;
}

#boxiesContent:has(.builder-step-content--estructura) .builder-workspace::-webkit-scrollbar-track,
.boxies-builder-embed:has(.builder-step-content--estructura) .builder-workspace::-webkit-scrollbar-track {
  background: transparent;
}

#boxiesContent:has(.builder-step-content--estructura) .builder-workspace::-webkit-scrollbar-thumb,
.boxies-builder-embed:has(.builder-step-content--estructura) .builder-workspace::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.14);
  border-radius: 999px;
}

#boxiesContent:has(.builder-step-content--estructura) .builder-workspace:hover::-webkit-scrollbar-thumb,
.boxies-builder-embed:has(.builder-step-content--estructura) .builder-workspace:hover::-webkit-scrollbar-thumb,
#boxiesContent:has(.builder-step-content--estructura) .builder-workspace:focus-within::-webkit-scrollbar-thumb,
.boxies-builder-embed:has(.builder-step-content--estructura) .builder-workspace:focus-within::-webkit-scrollbar-thumb {
  background: rgba(111, 191, 134, 0.45);
}

#boxiesContent:has(.builder-step-content--estructura) .builder-main-panel,
.boxies-builder-embed:has(.builder-step-content--estructura) .builder-main-panel {
  flex: none !important;
  width: 100%;
  min-height: 0 !important;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
  display: block !important;
  border: none;
  border-radius: 0;
  background: transparent;
}

#boxiesContent:has(.builder-step-content--estructura) #builderStepPanel,
.boxies-builder-embed:has(.builder-step-content--estructura) #builderStepPanel {
  flex: none !important;
  min-height: 0 !important;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
  display: block !important;
  padding: 14px clamp(16px, 2.4vw, 28px) 10px;
  box-sizing: border-box;
}

body.boxies-rail-collapsed #boxiesContent:has(.builder-step-content--hero) .builder-workspace,
body.boxies-rail-collapsed #boxiesContent:has(.builder-step-content--estructura) .builder-workspace {
  margin-left: var(--builder-rail-width, 52px);
}