.bn-shadcn {
  --background: 0 0% 100%;
  --foreground: 0 0% 3.9%;
  --card: 0 0% 100%;
  --card-foreground: 0 0% 3.9%;
  --popover: 0 0% 100%;
  --popover-foreground: 240 10% 3.9%;
  --primary: 243 75% 59%;
  --primary-foreground: 0 0% 98%;
  --secondary: 0 0% 96.1%;
  --secondary-foreground: 0 0% 9%;
  --muted: 0 0% 96.1%;
  --muted-foreground: 0 0% 45.1%;
  --accent: 0 0% 96.1%;
  --accent-foreground: 0 0% 9%;
  --destructive: 0 84.2% 60.2%;
  --destructive-foreground: 0 0% 98%;
  --border: 240 5.9% 90%;
  --input: 240 5.9% 90%;
  --ring: 243 75% 59%;
}

.bn-shadcn.dark {
  --background: 240 10% 3.9%;
  --foreground: 0 0% 98%;
  --card: 240 10% 3.9%;
  --card-foreground: 0 0% 98%;
  --popover: 240 10% 3.9%;
  --popover-foreground: 0 0% 98%;
  --secondary: 240 3.7% 15.9%;
  --secondary-foreground: 0 0% 98%;
  --muted: 240 3.7% 15.9%;
  --muted-foreground: 240 5% 64.9%;
  --accent: 240 3.7% 15.9%;
  --accent-foreground: 0 0% 98%;
  --destructive: 0 62.8% 30.6%;
  --destructive-foreground: 0 0% 98%;
  --border: 240 3.7% 15.9%;
  --input: 240 3.7% 15.9%;
  --ring: 234.5 89.5% 73.9%;
}

.bn-inline-content:has(> .ProseMirror-trailingBreak:only-child):before {
  font-style: normal;
}

.bn-editor {
  padding-inline: 36px;
  min-height: 100%;
  height: 100%;
}

.bn-shadcn .bn-editor {
  background-color: transparent;
}

.bn-default-styles {
  font-size: inherit;
}

.bn-editor [class^='_inlineContent']:before {
  color: var(--muted-foreground);
  font-style: normal !important;
}

.bn-editor .bn-inline-content:has(> .ProseMirror-trailingBreak):before {
  font-style: normal;
}

.bn-editor .bn-container .bn-drag-handle {
  width: 20px;
  height: 20px;
}

.bn-editor .bn-block-content[data-content-type='checkListItem'] > div > div {
  display: flex;
  align-items: center;
}

.bn-editor .bn-drag-handle-menu {
  background: var(--background);
  backdrop-filter: var(--blur-medium);
  box-shadow: var(--shadow-medium);
  min-width: 160px;
  min-height: 96px;
  padding: 4px;
  border: 1px solid var(--border);
  left: 26px;
}

.bn-editor .bn-container .bn-suggestion-menu-item:hover {
  background-color: var(--primary);
}

.bn-editor .bn-container .bn-suggestion-menu {
  padding: 4px;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--background);
  backdrop-filter: var(--blur-medium);
}

.bn-editor .bn-color-picker-dropdown {
  margin-left: 8px;
}

.bn-editor .bn-inline-content code {
  font-family: monospace;
  color: var(--font-color-danger);
  padding: 2px 4px;
  border-radius: 4px;
  border: 1px solid var(--font-color-extra-light);
  font-size: 0.9rem;
  background-color: var(--background-transparent-light);
}

.bn-toolbar.bn-formatting-toolbar {
  padding: 2px;
  gap: 2px;
}

.bn-toolbar.bn-formatting-toolbar button {
  height: 28px;
  padding: 4px 7px;
  font-size: 13px;
  outline: none;
}

.read-only.bn-shadcn .bn-editor {
  background-color: transparent;
  padding-inline: 0;
}

.bn-side-menu {
  height: 26px;
}

[data-content-type='heading'] {
  --level: 24px;
}
[data-content-type='heading'][data-level='2'] {
  --level: 20px;
}

[data-content-type='heading'][data-level='3'] {
  --level: 16px;
}
