/* Spectra Free Editor drawer refinements
   Extends the framework drawer with editor-specific sizing and visual rhythm. */

body.sv-freeEditor .sv-drawerBackdrop{
  z-index:var(--sv-z-tools-backdrop);
}

body.sv-freeEditor .sv-drawer{
  z-index:var(--sv-z-tools-drawer);
  inline-size:min(var(--sv-drawer-width),calc(100vw - var(--sp-4,1rem)));
  background:
    linear-gradient(180deg,
      color-mix(in srgb,var(--sp-surface,#111827),var(--sv-blue) 5%) 0%,
      color-mix(in srgb,var(--sp-surface,#111827),var(--sp-bg,#050812) 18%) 100%);
  box-shadow:var(--sv-drawer-shadow);
}

body.sv-freeEditor .sv-drawerHeader{
  min-block-size:calc(var(--sp-10,2.5rem) + var(--sp-3,.75rem));
  padding:var(--sp-3,.75rem) var(--sp-4,1rem);
}

body.sv-freeEditor .sv-drawerHeader strong{
  color:var(--sp-text,#f6fbff);
  font-size:var(--sp-fs-3,1rem);
  font-weight:var(--sp-fw-bold,750);
  letter-spacing:-.02em;
}

body.sv-freeEditor .sv-drawerHeaderActions .sp-btn{
  min-block-size:var(--sv-drawer-close-h);
  padding-inline:var(--sp-3,.75rem);
  border-color:var(--sv-header-btn-border);
  border-radius:var(--sp-radius-3,1rem);
  background:var(--sv-header-btn-bg);
  box-shadow:var(--sv-header-btn-shadow);
  font-size:var(--sp-fs-1,.875rem);
  font-weight:var(--sp-fw-semibold,650);
}

body.sv-freeEditor .sv-drawerHeaderActions .sp-btn:focus-visible{
  outline:var(--sp-outline-1,var(--sp-border-w-2,2px)) solid color-mix(in srgb,var(--sv-blue),transparent 18%);
  outline-offset:var(--sp-border-w-1,1px);
  box-shadow:var(--sv-header-btn-shadow);
}

body.sv-freeEditor .sv-drawerBody{
  padding:var(--sp-4,1rem);
  overflow:auto;
}

body.sv-freeEditor .sv-drawerSection,
body.sv-freeEditor .sv-drawerActionsStack{
  gap:var(--sp-3,.75rem);
}

body.sv-freeEditor .sv-drawerSectionTitle{
  padding-inline:var(--sp-1,.25rem);
  color:color-mix(in srgb,var(--sp-muted,#9ca3af),var(--sp-text,#f6fbff) 10%);
  font-size:var(--sp-fs-1,.875rem);
  font-weight:var(--sp-fw-semibold,650);
  letter-spacing:.11em;
}

body.sv-freeEditor .sv-drawerActionsStack .sp-btn{
  min-block-size:var(--sv-drawer-action-h);
  padding-inline:var(--sp-4,1rem);
  border-radius:calc(var(--sp-radius-3,1rem) + var(--sp-border-w-2,2px));
  font-size:var(--sp-fs-2,1rem);
  font-weight:var(--sp-fw-semibold,650);
  justify-content:flex-start;
}

body.sv-freeEditor .sv-drawerActionButton{
  display:flex;
  align-items:center;
  gap:var(--sp-3,.75rem);
}

body.sv-freeEditor .sv-drawerActionIcon{
  inline-size:var(--sv-drawer-action-icon-size);
  block-size:var(--sv-drawer-action-icon-size);
  flex:0 0 var(--sv-drawer-action-icon-size);
  object-fit:contain;
  opacity:.95;
  filter:saturate(1.08) brightness(1.08);
  pointer-events:none;
}

body.sv-freeEditor .sv-drawerActionButton span{
  min-inline-size:0;
}

body.sv-freeEditor .sv-drawerActionsStack .sp-btn:focus-visible{
  outline:var(--sp-focus-ring);
  outline-offset:var(--sp-border-w-2,2px);
}

@media (max-width:38rem){
  body.sv-freeEditor .sv-drawer{
    inline-size:var(--sv-drawer-width);
  }

  body.sv-freeEditor .sv-drawerBody{
    padding:var(--sp-3,.75rem);
  }

  body.sv-freeEditor .sv-drawerActionIcon{
    inline-size:var(--sv-drawer-action-icon-size-mobile);
    block-size:var(--sv-drawer-action-icon-size-mobile);
    flex-basis:var(--sv-drawer-action-icon-size-mobile);
  }
}