/* ============================================================
   LAYERS & FRAMES
   ============================================================ */
.layer-item.active {
    background: var(--ui-surface-hover) !important;
    border-right: 3px solid var(--ui-accent) !important;
}
.layer-item.selected,
.layer-item.folder-item.selected {
    background: var(--ui-accent-soft) !important;
    border-right: 3px solid var(--ui-accent) !important;
}
.layer-item.selected.active,
.layer-item.folder-item.active,
.layer-item.folder-item.selected.active {
    background: var(--ui-accent-soft) !important;
    border-right: 3px solid var(--ui-accent) !important;
}
.layer-item.media-item   { border-left: 2px solid var(--ui-accent) !important; }
.layer-item.folder-item  { background: var(--ui-panel) !important;
                           border-left: 3px solid var(--ui-accent) !important; }

.layer-item.active-draw-page {
    background: var(--ui-accent-soft) !important;
    border-right: 3px solid var(--ui-accent) !important;
}
.layer-item.active-draw-page::after { color: var(--ui-accent) !important; }
.layer-item.active-draw-layer.folder-item {
    border-left: 3px solid var(--ui-accent) !important;
    background: var(--ui-accent-soft) !important;
}
.layer-lock.is-locked { color: var(--ui-accent) !important; }
.is-masked { border-left: 3px solid var(--ui-accent) !important; }

.frame.selected {
    outline: 2px solid var(--ui-accent) !important;
}
.frame.active {
    outline: 2px solid var(--ui-accent) !important;
    box-shadow: 0 0 8px var(--ui-accent-soft) !important;
}