body {
    background-color: skyblue;
}

.roll-builder-panel {
    border: 1px solid rgba(0, 0, 0, 0.125);
    border-radius: 0.5rem;
    background: #fff;
    min-height: 24rem;
}

.roll-builder-panel-header {
    padding: 0.75rem 1rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.125);
    background: rgba(0, 0, 0, 0.03);
}

.roll-builder-panel-body {
    padding: 0.75rem;
    max-height: 70vh;
    overflow: auto;
}

.roll-tree,
.catalog-tree {
    margin-bottom: 0;
}

.roll-tree-nested,
.catalog-tree-nested {
    margin-top: 0.5rem;
    margin-left: 1rem;
}

.roll-entry-kind-badge {
    font-size: 0.65rem;
    font-weight: 600;
    padding: 0.15em 0.45em;
    vertical-align: middle;
}

.roll-entry-catalogue-badge {
    font-size: 0.65rem;
    font-weight: 600;
    padding: 0.15em 0.45em;
    vertical-align: middle;
    border: 1px solid rgba(0, 0, 0, 0.08);
}

.roll-entry-catalogue-badge--0 {
    background-color: #dbeafe;
    color: #1e3a8a;
}

.roll-entry-catalogue-badge--1 {
    background-color: #dcfce7;
    color: #14532d;
}

.roll-entry-catalogue-badge--2 {
    background-color: #fef3c7;
    color: #78350f;
}

.roll-entry-catalogue-badge--3 {
    background-color: #fce7f3;
    color: #831843;
}

.roll-entry-catalogue-badge--4 {
    background-color: #e0e7ff;
    color: #312e81;
}

.roll-entry-catalogue-badge--5 {
    background-color: #ccfbf1;
    color: #115e59;
}

.roll-entry-catalogue-badge--6 {
    background-color: #ffedd5;
    color: #7c2d12;
}

.roll-entry-catalogue-badge--7 {
    background-color: #ede9fe;
    color: #4c1d95;
}

.roll-entry-catalogue-menu {
    flex-shrink: 0;
}

.roll-entry-catalogue-menu .dropdown-menu {
    min-width: 14rem;
}

.roll-builder-panels {
    --bs-gutter-x: 1rem;
}

.roll-entry-local-fields {
    display: grid;
    grid-template-columns: minmax(8rem, 1.5fr) minmax(6rem, 1fr) 5rem auto;
    gap: 0.35rem;
    align-items: center;
    width: 100%;
}

.roll-entry-local-actions,
.roll-entry-local-view-actions {
    display: flex;
    gap: 0.25rem;
    flex-shrink: 0;
}

.roll-entry-local-compact .roll-entry-row {
    align-items: center;
}

.roll-entry-content {
    min-width: 0;
}

.roll-entry-local .roll-entry-row {
    align-items: flex-start;
}

.roll-entry-row,
.catalog-item-row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.roll-entry-row {
    justify-content: space-between;
}

.roll-tree-collapsed,
.catalog-tree-collapsed {
    display: none;
}

.roll-entry.roll-collapsed-drop-target:not(.roll-collapsed-drop-active) > .roll-entry-row,
.catalog-item.catalog-collapsed-drop-target:not(.catalog-collapsed-drop-active) > .catalog-item-row {
    outline: 1px dashed rgba(13, 110, 253, 0.3);
    outline-offset: -1px;
}

.roll-entry.roll-collapsed-drop-active > .roll-entry-row,
.catalog-item.catalog-collapsed-drop-active > .catalog-item-row {
    background-color: rgba(13, 110, 253, 0.16);
    outline: 2px solid rgba(13, 110, 253, 0.65);
    outline-offset: -2px;
    box-shadow: inset 4px 0 0 rgba(13, 110, 253, 0.65);
}

.tree-collapse-toggle,
.tree-collapse-spacer {
    width: 1.25rem;
    flex-shrink: 0;
    text-align: center;
}

.roll-entry-label,
.catalog-item-label {
    cursor: grab;
    flex: 1;
    min-width: 0;
}

.roll-entry.sortable-chosen .roll-entry-label,
.catalog-item.sortable-chosen .catalog-item-label {
    cursor: grabbing;
}

.sortable-ghost {
    opacity: 0.45;
}

.roll-tree-empty {
    font-style: italic;
}

.item-builder-panel {
    border: 1px solid rgba(0, 0, 0, 0.125);
    border-radius: 0.5rem;
    background: #fff;
    min-height: 24rem;
}

.item-builder-panel-header {
    padding: 0.75rem 1rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.125);
    background: rgba(0, 0, 0, 0.03);
}

.item-builder-panel-body {
    padding: 0.75rem;
    max-height: 75vh;
    overflow: auto;
}

.item-tree {
    margin-bottom: 0;
}

.item-tree-nested {
    margin-top: 0.5rem;
    margin-left: 1rem;
}

.item-tree-collapsed {
    display: none;
}

.item-node.item-collapsed-drop-target:not(.item-collapsed-drop-active) > .item-node-row {
    outline: 1px dashed rgba(13, 110, 253, 0.3);
    outline-offset: -1px;
}

.item-node.item-collapsed-drop-active > .item-node-row {
    background-color: rgba(13, 110, 253, 0.16);
    outline: 2px solid rgba(13, 110, 253, 0.65);
    outline-offset: -2px;
    box-shadow: inset 4px 0 0 rgba(13, 110, 253, 0.65);
}

.item-node-row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.item-collapse-toggle,
.item-collapse-spacer {
    width: 1.25rem;
    flex-shrink: 0;
    text-align: center;
}

.item-drag-handle {
    cursor: grab;
    color: rgba(0, 0, 0, 0.45);
    flex-shrink: 0;
}

.item-node.sortable-chosen .item-drag-handle {
    cursor: grabbing;
}

.item-field {
    min-width: 5rem;
    padding: 0.125rem 0.25rem;
    border-radius: 0.25rem;
}

.item-field-name {
    flex: 1 1 10rem;
    font-weight: 500;
}

.item-field-property {
    flex: 0 1 8rem;
    color: rgba(0, 0, 0, 0.65);
}

.item-count-prefix {
    flex-shrink: 0;
    margin-right: 0.35rem;
    font-variant-numeric: tabular-nums;
    color: rgba(0, 0, 0, 0.55);
    cursor: pointer;
    white-space: nowrap;
}

.item-count-prefix-editing {
    cursor: text;
}

.roll-local-name-row {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    flex: 1 1 10rem;
}

.roll-local-name-row .roll-local-name {
    flex: 1 1 auto;
    min-width: 0;
}

.roll-local-quantity-input {
    width: 3rem;
    min-width: 3rem;
}

.item-field-weight {
    flex: 0 0 11rem;
    text-align: right;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.item-field:hover {
    background: rgba(0, 0, 0, 0.04);
}

.item-inline-input {
    min-width: 5rem;
}

.item-can-be-parent {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    flex: 0 0 auto;
    white-space: nowrap;
}

.item-node-actions {
    display: flex;
    gap: 0.25rem;
    margin-left: auto;
    flex-shrink: 0;
    align-items: center;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.item-move-select {
    width: auto;
    min-width: 7.5rem;
    max-width: 11rem;
}

.item-tree-empty {
    font-style: italic;
}

.item-builder-search {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.25rem;
    min-width: 14rem;
    max-width: 20rem;
}

.item-builder-search-status {
    white-space: nowrap;
}

.item-node-search-match {
    background-color: rgba(255, 193, 7, 0.22);
    border-color: rgba(255, 193, 7, 0.45);
}

.item-node-search-ancestor {
    background-color: rgba(255, 193, 7, 0.08);
}

.item-node-search-dim {
    opacity: 0.35;
}

.item-search-mark {
    padding: 0;
    background-color: rgba(255, 193, 7, 0.55);
    border-radius: 0.125rem;
}

.catalogue-print {
    background: #fff;
}

.catalogue-print-tree {
    list-style: none;
    margin: 0;
    padding: 0;
    background: #fff;
}

.catalogue-print-tree-root {
    border: 1px solid rgba(0, 0, 0, 0.125);
    border-radius: 0.5rem;
    overflow: hidden;
    background: #fff;
}

.catalogue-print-header {
    font-size: 0.875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: rgba(0, 0, 0, 0.55);
    background: #fff;
    border: 1px solid rgba(0, 0, 0, 0.125);
    border-radius: 0.5rem 0.5rem 0 0;
    margin-bottom: -1px;
}

.catalogue-print-node {
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
    background: #fff;
}

.catalogue-print-node:last-child {
    border-bottom: none;
}

.catalogue-print-tree .catalogue-print-tree {
    margin-left: 0;
}

.catalogue-print-row {
    display: grid;
    grid-template-columns: auto minmax(12rem, 2fr) minmax(8rem, 1fr) minmax(5rem, auto) minmax(8rem, auto);
    gap: 1rem;
    align-items: center;
    padding: 0.5rem 0.75rem;
    padding-left: calc(0.75rem + var(--depth, 0) * 2.25rem);
    font-variant-numeric: tabular-nums;
    background: #fff;
}

.catalogue-print-checkbox {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 1.25rem;
}

.catalogue-print-checkbox input[type='checkbox'] {
    width: 1rem;
    height: 1rem;
    margin: 0;
}

.catalogue-print-name {
    font-weight: 400;
    font-style: normal;
}

.catalogue-print-node-depth-0 > .catalogue-print-row > .catalogue-print-name {
    font-weight: 700;
}

.catalogue-print-node-depth-1 > .catalogue-print-row > .catalogue-print-name {
    font-weight: 400;
    font-style: italic;
}

.catalogue-print-property {
    color: rgba(0, 0, 0, 0.65);
}

.catalogue-print-count,
.catalogue-print-weight {
    text-align: right;
    white-space: nowrap;
}

@media print {
    body,
    .content,
    .container,
    .catalogue-print,
    .catalogue-print-tree,
    .catalogue-print-tree-root,
    .catalogue-print-node,
    .catalogue-print-row,
    .catalogue-print-header {
        background: #fff !important;
    }

    #topnav,
    .catalogue-print-toolbar {
        display: none !important;
    }

    .content {
        margin-top: 0 !important;
    }

    .container {
        max-width: none;
        width: 100%;
        padding: 0;
    }

    .catalogue-print-tree-root {
        border: none;
        border-radius: 0;
    }

    .catalogue-print-row {
        break-inside: avoid;
    }
}