/* Selector-scoped compatibility for theme-provided wishes.html pages. */
.wish-board {
  --wish-collapsed-body-height: 176px;
  overflow: hidden !important;
  isolation: isolate;
}

.wish-board[data-wb-header-overlay="true"] {
  overflow: visible !important;
  /* Keep all card z-indices above the page title, below the theme navigation. */
  z-index: 1;
  clip-path: inset(var(--wish-safe-clip-top, 0px) 0 0);
}

.wish-board .wish-card {
  display: flex;
  flex-direction: column;
  max-height: var(--wish-safe-card-height, calc(100dvh - 160px)) !important;
  overflow: hidden !important;
}

.wish-board .wish-card-header,
.wish-board .wish-card-footer,
.wish-board .wish-card-ai,
.wish-board .wish-card-done-note,
.wish-board .wish-card-done-img,
.wish-board .wish-card-expand {
  flex: 0 0 auto;
}

.wish-board .wish-card-body {
  min-height: 0;
  max-height: var(--wish-collapsed-body-height);
  overflow: hidden;
  overscroll-behavior: contain;
}

.wish-board .wish-card-body > span:first-child,
.wish-board .wish-card-body > .wb-card-text {
  white-space: pre-wrap;
}

.wish-board .wish-card.wb-card-expanded .wish-card-body {
  /* Flex sizing reserves the real header/footer height, then scrolls the body
     only when the whole card fills the available space. */
  max-height: none;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: rgba(0, 0, 0, .18) transparent;
}

.wish-board .wish-card.wb-card-expanded .wish-card-body::-webkit-scrollbar {
  width: 5px;
}

.wish-board .wish-card.wb-card-expanded .wish-card-body::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: rgba(0, 0, 0, .18);
}

.wish-board .wish-card-expand {
  align-self: flex-start;
  margin: -3px 16px 7px;
  padding: 2px 0;
  border: 0;
  color: rgba(0, 0, 0, .46);
  background: transparent;
  font: inherit;
  font-size: 11px;
  cursor: pointer;
}

.wish-board .wish-card-expand:hover,
.wish-board .wish-card-expand:focus-visible {
  color: rgba(0, 0, 0, .78);
}

.wish-input-bar .wish-input-content.wb-multiline-composer {
  box-sizing: border-box;
  min-width: 240px;
  min-height: 34px;
  max-height: min(160px, 26vh);
  line-height: 1.5;
  resize: none;
  overflow-y: hidden;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

@media (max-width: 768px) {
  .wish-board {
    --wish-collapsed-body-height: 112px;
  }

  .wish-input-bar .wish-input-content.wb-multiline-composer {
    min-width: 180px;
    max-height: min(120px, 22vh);
  }

  .wish-board .wish-card-expand {
    margin: -2px 10px 5px;
    font-size: 9px;
  }
}
