.collapsibleCodeBlockContainer {
  display: flex;
  flex-direction: column;
  width: 100%;
}

.codeWrapper {
  position: relative;
  overflow: hidden;
  transition: max-height 0.2s ease-out;
}

.codeWrapper.collapsed {
  /* maxHeight is set via inline style */
}

.codeWrapper.expanded {
  cursor: pointer;
}

.gradientOverlay {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 60px;
  background: linear-gradient(
    to bottom,
    transparent 0%,
    var(--code-block-bg, var(--vscode-editor-background)) 100%
  );
  pointer-events: none;
}

.toggleButton {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  background: var(--code-block-bg, var(--vscode-editor-background));
  border: 1px solid var(--vscode-editorGroup-border, transparent);
  border-top: none;
  border-radius: 0 0 5px 5px;
  color: var(--vscode-textLink-foreground, #3794ff);
  cursor: pointer;
  padding: 6px 12px;
  font-size: var(--vscode-font-size, 13px);
  font-family: var(--vscode-font-family);
  width: 100%;
  margin-top: -1px;
  transition: background-color 0.15s ease;
}

.toggleButton:hover {
  background: var(--vscode-toolbar-hoverBackground, rgba(90, 93, 94, 0.31));
}

.toggleButton:focus {
  outline: 1px solid var(--vscode-focusBorder);
  outline-offset: -1px;
}

.toggleButton span.codicon {
  font-size: 14px;
}
