.helmet-rich-text {
    border: 1px solid var(--bs-border-color);
    border-radius: var(--bs-border-radius);
    overflow: hidden;
}

.helmet-rich-text-toolbar {
    display: flex;
    flex-wrap: wrap;
    gap: .25rem;
    padding: .375rem;
    background: var(--bs-tertiary-bg);
    border-bottom: 1px solid var(--bs-border-color);
}

.helmet-rich-text-image-panel {
    display: grid;
    grid-template-columns: minmax(14rem, 2fr) minmax(10rem, 1fr) auto auto;
    gap: .5rem;
    align-items: center;
    padding: .5rem;
    border-bottom: 1px solid var(--bs-border-color);
    background: var(--bs-secondary-bg);
}

.helmet-rich-text-image-panel[hidden] {
    display: none;
}

@media (max-width: 767.98px) {
    .helmet-rich-text-image-panel {
        grid-template-columns: 1fr 1fr;
    }
}

.helmet-rich-text-editor {
    min-height: 180px;
    overflow: auto;
    border: 0 !important;
    border-radius: 0 !important;
    outline: none;
    white-space: normal;
}

.helmet-rich-text-editor:focus {
    box-shadow: inset 0 0 0 2px rgba(var(--bs-primary-rgb), .2);
}

.helmet-rich-text-editor[contenteditable="false"] {
    background: var(--bs-tertiary-bg);
}

.helmet-rich-text-editor img {
    max-width: 100%;
    height: auto;
}

.helmet-rich-text-editor h1,
.helmet-rich-text-editor h2,
.helmet-rich-text-editor h3 {
    margin-block: .75em .4em;
}

.helmet-rich-text-source:not([hidden]) {
    display: block;
    min-height: 180px;
    font-family: var(--bs-font-monospace);
}

.helmet-rich-text-source[hidden] {
    display: none !important;
}

.helmet-tree ul {
    list-style: none;
    margin: .25rem 0 .25rem 1rem;
    padding-left: .8rem;
    border-left: 1px solid var(--bs-border-color);
}

.helmet-tree > ul {
    margin-left: 0;
    padding-left: 0;
    border-left: 0;
}

.helmet-tree li {
    position: relative;
    padding: .15rem 0;
}

.helmet-tree-toggle {
    width: 1.4rem;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--bs-secondary-color);
}

.helmet-tree-drag-handle {
    width: 1.6rem;
    min-height: 1.8rem;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--bs-secondary-color);
    font-size: 1.25rem;
    line-height: 1;
    cursor: grab !important;
    touch-action: none;
}

.helmet-tree-drag-handle:hover,
.helmet-tree-drag-handle:focus-visible {
    color: var(--bs-primary);
}

.helmet-tree-drag-handle:active {
    cursor: grabbing !important;
}

.helmet-tree-dragging {
    opacity: .45;
}

.helmet-tree li > a {
    text-decoration: none;
}

.helmet-tree-empty-drop-target {
    display: none;
}

.helmet-tree-drag-active .helmet-tree-empty-drop-target {
    display: flex;
    align-items: center;
    min-height: 1.75rem;
    margin: .2rem 0 .25rem 1.4rem;
    padding: .2rem .5rem;
    border: 1px dashed var(--bs-primary);
    border-radius: var(--bs-border-radius-sm);
    color: var(--bs-secondary-color);
    font-size: .8rem;
}

.helmet-tree li.selected > a,
.helmet-tree li.active > a {
    color: var(--bs-primary);
    font-weight: 600;
}

.helmet-tree .deleted > a {
    color: var(--bs-secondary-color);
    text-decoration: line-through;
}

.helmet-tree [draggable="true"] {
    cursor: grab;
}

.helmet-tree-dragging,
.helmet-sort-dragging {
    opacity: .5;
}

.helmet-tree-drop-before {
    box-shadow: inset 0 2px var(--bs-primary);
}

.helmet-tree-drop-after {
    box-shadow: inset 0 -2px var(--bs-primary);
}

.helmet-tree-drop-into {
    background: rgba(var(--bs-primary-rgb), .1);
}

.helmet-sort-before {
    box-shadow: inset 0 2px var(--bs-primary);
}

.helmet-sort-after {
    box-shadow: inset 0 -2px var(--bs-primary);
}