/* Shared content-sized geometry for every canonical Add/Edit sheet.
   Sheets grow only as needed, then cap at a 3.5rem backdrop reveal. */
:root {
  --canonical-editor-backdrop-gap: 3.5rem;
}

html:has([data-canonical-editor-panel]),
body:has([data-canonical-editor-panel]) {
  overflow: hidden;
}

[data-canonical-editor-panel] {
  box-sizing: border-box;
  display: flex !important;
  flex-direction: column;
  /* Final shared contract intentionally overrides older feature-specific sizes. */
  height: auto !important;
  max-height: calc(100dvh - var(--canonical-editor-backdrop-gap)) !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

[data-canonical-editor-scroll-region] {
  flex: 0 1 auto;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior-y: contain;
  scrollbar-gutter: stable;
  -webkit-overflow-scrolling: touch;
  touch-action: pan-y;
}

[data-canonical-editor-panel] > form:has(> [data-canonical-editor-scroll-region]) {
  display: flex !important;
  flex: 0 1 auto;
  flex-direction: column;
  align-items: stretch;
  min-height: 0;
  overflow: hidden;
}

[data-canonical-editor-panel] [data-canonical-editor-footer] {
  position: static !important;
  inset: auto;
  flex: 0 0 auto;
}

/* Task now follows Habit, Chore, and Shopping: body alone scrolls; footer does not. */
.page-shell [data-canonical-task-edit-panel] > .task-form {
  gap: 0;
  min-height: 0;
  padding: 0;
  overflow: hidden;
}

.page-shell [data-canonical-task-edit-panel] .task-form__body {
  display: grid;
  align-content: start;
  gap: 0.82rem;
  padding-right: 0.15rem;
}

.page-shell [data-canonical-task-edit-panel] .task-form > [data-canonical-editor-footer] {
  position: static !important;
  inset: auto;
  z-index: 2;
  margin: 0;
  pointer-events: auto;
}

@media (max-width: 760px) {
  [data-canonical-editor-panel] {
    top: auto;
    right: 0;
    bottom: 0;
    left: 0;
  }

  .page-shell [data-canonical-task-edit-panel] .task-form__body {
    gap: 0.72rem;
    padding: 0 0.15rem 0.85rem 0;
    scroll-padding-bottom: 1rem;
  }

  [data-canonical-habit-sheet] .habit-sheet-form__body {
    padding-bottom: 1.25rem;
    scroll-padding-bottom: 1rem;
  }

  [data-canonical-habit-sheet].habit-sheet {
    padding-bottom: 0;
  }

  [data-canonical-habit-sheet] .habit-sheet-form__actions {
    width: calc(100% + 2.7rem);
    margin-inline: -1.35rem;
  }

  .page-shell [data-canonical-task-edit-panel] .task-form > [data-canonical-editor-footer] {
    margin: 0 -1.35rem;
    padding: 0.85rem 1.35rem var(--canonical-editor-action-bottom-gap);
    background: color-mix(in srgb, var(--color-card) 96%, white);
  }

  .page-shell [data-canonical-task-edit-panel] .task-form--edit > [data-canonical-editor-footer] {
    padding-left: 5.25rem;
  }

  .page-shell [data-canonical-task-edit-panel] .task-delete-icon-form {
    position: absolute;
    bottom: var(--canonical-editor-action-bottom-gap);
    left: 1.35rem;
  }

  [data-canonical-editor-panel] [data-canonical-editor-footer] {
    filter: none !important;
  }

  [data-canonical-editor-panel][data-canonical-editor-overflowing="true"] [data-canonical-editor-footer] {
    filter: drop-shadow(0 -12px 18px color-mix(in srgb, var(--color-ink) 14%, transparent)) !important;
  }
}

@media (min-width: 761px) {
  [data-canonical-editor-panel] {
    top: 50%;
    bottom: auto;
    transform: translate(-50%, -50%);
  }

  .page-shell [data-canonical-task-edit-panel] .task-form > [data-canonical-editor-footer] {
    margin-top: auto;
    padding: 1rem 0 0;
    filter: none;
  }

  .page-shell [data-canonical-task-edit-panel] .task-form--edit > [data-canonical-editor-footer] {
    padding-left: 4.05rem;
  }
}