@import url("./free-editor.responsive.css?v=20260726-shared-promotion1");

/* Spectra Free Editor positioned shell
   Sole owner of viewport bands and positioned editor geometry. Component
   appearance remains in the header, editor, and footer component files. */

body.sp-app-shell.sv-freeEditor{
  /* Desktop editor surface extends the framework web container by 24rem:
     72rem framework container + 24rem editor expansion = approved 96rem. */
  --sv-shell-content-expansion:24rem;
  --sv-shell-content-max:calc(var(--sp-container-max,72rem) + var(--sv-shell-content-expansion));
  --sv-z-skip-link:var(--sp-layer-overlay,70);
  --sv-z-suggest:var(--sp-z-popover,30);

  position:relative;
  display:block;
  inline-size:var(--sv-shell-app-w);
  block-size:var(--sv-shell-app-h);
  min-inline-size:0;
  min-block-size:100svh;
  margin:0;
  overflow:hidden;
}

body.sv-freeEditor .sv-editorHeader{
  position:fixed;
  inset-block-start:0;
  inset-inline:0;
  block-size:var(--sv-editor-header-h);
  min-block-size:var(--sv-editor-header-h);
  max-block-size:var(--sv-editor-header-h);
}

body.sv-freeEditor .sv-editorHeaderInner{
  z-index:1;
  box-sizing:border-box;
  inline-size:100%;
  max-inline-size:var(--sv-shell-content-max);
  block-size:100%;
  min-block-size:0;
  max-block-size:100%;
  margin-inline:auto;
  padding-inline:var(--sv-shell-gutter);
}

body.sv-freeEditor .sv-editorMain{
  position:absolute;
  inset-inline:0;
  inset-block-start:var(--sv-editor-header-h);
  inset-block-end:var(--sv-editor-footer-reserve);
  min-block-size:0;
  padding:var(--sv-shell-gutter) var(--sv-shell-gutter) 0;
  overflow:hidden;
}

body.sv-freeEditor .sv-editorWorkspace{
  position:relative;
  inline-size:100%;
  max-inline-size:var(--sv-shell-content-max);
  block-size:100%;
  min-block-size:0;
  margin-inline:auto;
}

body.sv-freeEditor .sv-editorPanel{
  position:absolute;
  inset:0;
  block-size:auto;
  min-block-size:0;
}

body.sv-freeEditor.is-editor-focus .sv-editorMain{
  inset-block:0;
  padding:var(--sp-2,.5rem);
}

body.sv-freeEditor.is-editor-focus .sv-editorWorkspace{
  max-inline-size:none;
  block-size:100%;
}

@media (max-width:54rem){
  body.sp-app-shell.sv-freeEditor{
    --sv-editor-header-h:var(--sv-editor-header-h-mobile);
  }

  body.sv-freeEditor .sv-editorHeaderInner{
    grid-template-rows:minmax(var(--sv-editor-header-brand-row-min),1fr) var(--sv-editor-header-tools-row-h);
    align-content:center;
  }
}

/* Reassert the approved tablet portrait geometry after the general compact
   shell band above. The rest of the tablet styling lives in the shared
   responsive layer imported at the top of this file. */
@media (min-width:48rem) and (max-width:64rem) and (orientation:portrait){
  body.sp-app-shell.sv-freeEditor{
    --sv-editor-header-h:6.25rem;
  }

  body.sv-freeEditor .sv-editorHeaderInner{
    grid-template-rows:minmax(2.5rem,1fr) var(--sv-editor-header-tools-row-h);
  }

  body.sv-freeEditor .sv-editorHeaderBrandSlot{
    grid-area:auto;
    grid-column:1;
    grid-row:1;
  }

  body.sv-freeEditor .sv-editorHeaderActions{
    grid-area:auto;
    grid-column:2;
    grid-row:1;
  }

  body.sv-freeEditor .sv-editorHeaderToolsRow{
    grid-area:auto;
    grid-column:1 / -1;
    grid-row:2;
  }
}
