.dropdown-item.active {
    background-color: var(--bs-theme);
    color: white;
}

    .dropdown-item.active:hover {
        background-color: #0b5ed7;
        color: white;
    }

/* Summernote dialog (link, image, etc.): solid panel bg, not gray overlay color */
.note-editor .note-modal.open {
    background: rgba(0, 0, 0, 0.5);
}

.note-editor .note-modal .note-modal-content {
    background: var(--bs-app-header-bg, var(--bs-body-bg));
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
}

.note-editor .note-modal .note-modal-content .note-modal-header .note-modal-title,
.note-editor .note-modal .note-modal-content .note-modal-header .close {
    color: var(--bs-body-color);
}

/* Sidebar overlay mode: when user preference is unpinned (app-sidebar-unpinned)
   and the hamburger temporarily opens it (app-sidebar-toggled), float over content */
.app.app-sidebar-unpinned.app-sidebar-toggled .app-content,
.app.app-sidebar-unpinned.app-sidebar-toggled #content {
    margin-left: 0 !important;
}
.app.app-sidebar-unpinned.app-sidebar-toggled .app-footer {
    margin-left: 2rem !important;
}

/* Solid background for sidebar when floating over content */
.app.app-sidebar-unpinned .app-sidebar {
    background: var(--bs-app-header-bg) !important;
    box-shadow: 4px 0 16px rgba(0, 0, 0, 0.15);
}

/* Mobile header: the theme hides the brand below 768px, leaving no way back to the dashboard.
   Keep the logo (letter + app name) right after the menu button; long names are cut with "...". */
@media (max-width: 767.98px) {
    .app-header .mobile-toggler {
        margin-right: 0 !important;
        margin-left: 0 !important;
    }

    .app-header .brand {
        display: flex !important;
        width: auto;
        min-width: 0;
        flex: 0 1 auto;
        padding: 0 .5rem;
    }

    .app-header .brand .brand-logo {
        display: flex !important;
        min-width: 0;
    }

    .app-header .brand .brand-text {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        max-width: 40vw;
    }
}
