/* Module Custom Styles */
* {
    box-sizing: border-box;
}

.cursorHand {
    cursor: pointer;
}
/*Container*/

.sideNav {
    margin-top: 30px;
}

.mainContent {
    flex-grow: 1;
    align-self: stretch;
}


/*Pager*/
.SearchBoxClass {
    /*width:50%;*/
}

.TopicBody {
    font-family: var(--bs-body-font-family);
    font-size: 0.9rem;
    font-weight: var(--bs-body-font-weight);
    line-height: var(--bs-body-line-height);
    color: var(--bs-body-color);
    text-align: var(--bs-body-text-align);
}

.NoEvents {
    pointer-events: none;
}

.DisplayHidden {
    display: none;
    visibility: hidden;
    max-width: 0;
}
.no-wrap {
    white-space: nowrap; /* Prevents wrapping */
}

.sideNavContainer {
    display: flex;
}

.sideNav, .sideNav > ul {
    width: 300px;
}

    .sideNav > ul {
        margin: 0;
        padding: 0;
        list-style: none;
    }

.item-excerpt {
    margin-top: 4px;
    white-space: normal;
    font-size: 12px;
    line-height: 1.5em;
    display: block;
    word-break: break-word;
    color: var(--bs-body-color);
    opacity: 0.8;
    text-overflow: ellipsis;
}

.small-x {
    font-size: 0.75rem;
}

.small-x-NavLink {
    font-size: 0.85rem;
}

.fs-5-5 {
    font-size: 1.1rem !important;
}

/*Editor*/
.discussionPost-container {
    min-height: 165px;
}

.discussion-list-group-item {
    width: 100%;
    border: 0;
    position: relative;
    display: block;
    /*padding-left: var(--bs-list-group-item-padding-x);*/
    padding-right: var(--bs-list-group-item-padding-x);
    color: var(--bs-list-group-color);
    text-decoration: none;
}
    /* Ensure path links and buttons stay aligned */
    .discussion-list-group-item .ms-1 {
        margin-left: 0 !important; /* Adjust as needed */
    }

    /* Optional: Add a class for toggling indentation */
    .discussion-list-group-item.indented {
        padding-left: 1rem !important; /* Add indentation when needed */
    }

    .discussion-list-group-item.not-indented {
        padding-left: 0rem !important;
    }

.discussion-list-group .discussion-list-group {
    /*    margin-left: -1rem;*/
    margin-right: -1rem !important;
}

.document-viewer {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: start;
    border: 1px solid var(--primary-border);
    overflow: hidden; /* Add this to prevent content from spilling out */
    color: var(--bs-body-color);
    background-color: var(--bs-body-bg);
    border-color: var(--bs-border-color);
    display: inline-flex;
}

    .document-viewer iframe,
    .document-viewer video {
        /* width: 100%; height: 100%; <-- REMOVE */
        max-width: 100vw; /* Optional: to not overflow window */
        /* max-height: 100vh; Optional: to not overflow window */
        align-items: center;
        object-fit: contain;
        border: 0;
        display: block;
    }

.document-container {
    width: 100%;
    /* max-width: 800px; Adjust this value as needed */
    margin: 1rem auto;
    overflow: hidden;
}

    .document-container.collapsed {
        /* Styles for when no document is selected */
    }

    .document-container.expanded {
        /* Styles for when a document is selected */
        /*height: 100vh;*/
        display: flex;
        flex-direction: column;
    }

        .document-container.expanded .document-viewer {
            flex-grow: 1;
        }


/* Style the emoji buttons inside the dropdown */
.dropdown-menu .btn {
    width: 24px; /* Adjust size as needed */
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%; /* Circular buttons */
}

    .dropdown-menu .btn i {
        font-size: 1.5rem; /* Adjust icon size */
    }

.markdown-content i {
    font-size: 1.25rem;
    margin-right: 0.25rem;
    vertical-align: middle;
}

.markdown-content br {
    line-height: 1.5;
}

.task-list {
    padding-left: 0 !important;
    list-style-type: none;
}
/* Double Arrow*/
.double-arrow {
    position: relative;
    display: inline-block;
}

    .double-arrow .bi {
        position: absolute;
        top: 0;
        left: 0;
    }

        .double-arrow .bi:nth-child(2) {
            top: 9px; /* Adjust for vertical offset */
            left: 4px; /* Adjust for horizontal offset */
        }

/*VoteStarRating*/
.star {
    color: var(--bs-body-color);
}

    .star.filled,
    .star.highlighted {
        color: gold;
    }

/* mini margin */
.mt-small {
    margin-top: .10rem !important;
}

blockquote {
    margin-left: 20px;
    padding-left: 10px;
    border-left: 3px solid var(--bs-border-color);
}

.HorizontalStack {
    display: flex;
    flex-direction: row;
}

.drilldown-hidden {
    display: none;
    visibility: hidden;
    max-width: 0;
}

.search-width {
    width: 50%;
}
@media screen and (min-width: 992px) {
    .media991-no-display {
        display: none;
        visibility: hidden;
        max-width: 0;
        max-height: 0;
    }

    .media768-991-no-display {
        display: none;
        visibility: hidden;
        max-width: 0;
        max-height: 0;
    }

    .media767-display {
        display: none;
        visibility: hidden;
        max-width: 0;
        max-height: 0;
    }
}
    @media (min-width: 768px) and (max-width: 991.98px) {
        .sideNav-horizontal {
            display: flex;
            flex-wrap: wrap;
            gap: 1rem;
            padding: 1rem;
            border-radius: 0.25rem;
        }

        .media768-991-no-display {
            display: none;
            visibility: hidden;
            max-width: 0;
            max-height: 0;
        }

        .media767-display {
            display: none;
            visibility: hidden;
            max-width: 0;
            max-height: 0;
        }

        .sideNav-horizontal > * {
            flex: 1 1 auto;
        }

        .sideNav-horizontal ul {
            list-style-type: none;
            padding-left: 0;
        }

        .search-width {
            width: 75%;
        }
    }

    @media (max-width: 767.98px) {
        .offcanvas-bottom {
            height: 80vh;
        }

        .offcanvas-body ul {
            list-style-type: none;
            padding-left: 0;
        }

        .media767-no-display {
            display: none;
            visibility: hidden;
            max-width: 0;
            max-height: 0;
        }

        .search-width {
            width: 100%;
        }
    }
    /* TagInput */
    .tag-list {
        display: inline-flex;
        flex-wrap: wrap;
        margin: 0;
        list-style: none;
    }

    .tag-badge {
        margin-left: 5px;
    }

    .tag-close-btn {
        cursor: pointer;
        font-weight: bold;
        background: none;
        border: none;
        padding: 0 5px;
        display: flex;
        align-items: center;
    }

    .tag-input {
        border: none;
        width: 100%;
    }

    .input-outline {
        outline: auto;
    }

    .validation-error {
        color: #dc3545;
        font-size: 80%;
        margin-top: 0.25rem;
        width: 100%;
    }

    /* Add your mdi icon font CSS or reference the CDN */



    /*Tabs*/
    :root {
        /* Preload */
        --bs-preload-modal-z-index: 2055;
        --bs-preload-modal-backdrop-z-index: 2050;
        /* Confirm Dialog */
        --bs-confirm-dialog-z-index: 2045;
        --bs-confirm-dialog-backdrop-z-index: 2040;
        /* Offcanvas */
        --bs-offcanvas-close-icon-font-size: 2rem;
        --bs-offcanvas-footer-padding-y: 1rem;
        --bs-offcanvas-footer-padding-x: 1rem;
        --bs-offcanvas-horizontal-width-sm: 300px;
        --bs-offcanvas-horizontal-width-lg: 800px;
        /* Tooltip */
        --bs-tooltip-primary: var(--bs-primary);
        --bs-tooltip-secondary: var(--bs-secondary);
        --bs-tooltip-success: var(--bs-success);
        --bs-tooltip-danger: var(--bs-danger);
        --bs-tooltip-warning: var(--bs-warning);
        --bs-tooltip-info: var(--bs-info);
        --bs-tooltip-light: var(--bs-light);
        --bs-tooltip-dark: var(--bs-dark);
        --bs-tooltip-color-white: var(--bs-white);
        --bs-tooltip-color-dark: var(--bs-black);
        /* Border */
        --bs-border-radius-xs: 0.125rem;
        --bs-border-radius-md: 0.375rem;
        /* Sidebar */
        --bs-sidebar-width: 270px;
        --bs-sidebar-collapsed-width: 50px;
        --bs-sidebar-background-color: rgba(255, 255, 255, 1);
        --bs-sidebar-top-row-background-color: var(--bs-primary);
        --bs-sidebar-title-text-color: rgb(255, 255, 255);
        --bs-sidebar-nav-item-text-color: rgba(0, 0, 0, 0.9);
        --bs-sidebar-nav-item-text-active-color-rgb: 112.520718, 44.062154, 249.437846;
        --bs-sidebar-nav-item-text-hover-color: rgba(var(--bs-sidebar-nav-item-text-active-color-rgb), 0.9);
        --bs-sidebar-nav-item-text-active-color: rgba(var(--bs-sidebar-nav-item-text-active-color-rgb), 0.9);
        --bs-sidebar-nav-item-background-hover-color: rgba(var(--bs-sidebar-nav-item-text-active-color-rgb), 0.08);
    }

    /* Dark Theme */
    [data-bs-theme=dark] {
        --bs-sidebar-background-color: var(--bs-body-bg);
        --bs-sidebar-top-row-background-color: var(--bs-body-bg);
        --bs-sidebar-title-text-color: var(--bs-body-color);
        --bs-sidebar-nav-item-text-color: var(--bs-body-color);
        --bs-sidebar-nav-item-text-active-color-rgb: 112.520718, 44.062154, 249.437846;
        --bs-sidebar-nav-item-text-hover-color: var(--bs-emphasis-color);
        --bs-sidebar-nav-item-text-active-color: var(--bs-emphasis-color);
        --bs-sidebar-nav-item-background-hover-color: rgba(var(--bs-primary-rgb), 0.5);
    }

    /* Tooltip Styles */
    .bb-tooltip-primary {
        --bs-tooltip-bg: var(--bs-tooltip-primary);
        --bs-tooltip-color: var(--bs-tooltip-color-white);
    }

    .bb-tooltip-secondary {
        --bs-tooltip-bg: var(--bs-tooltip-secondary);
        --bs-tooltip-color: var(--bs-tooltip-color-white);
    }

    .bb-tooltip-success {
        --bs-tooltip-bg: var(--bs-tooltip-success);
        --bs-tooltip-color: var(--bs-tooltip-color-white);
    }

    .bb-tooltip-danger {
        --bs-tooltip-bg: var(--bs-tooltip-danger);
        --bs-tooltip-color: var(--bs-tooltip-color-white);
    }

    .bb-tooltip-warning {
        --bs-tooltip-bg: var(--bs-tooltip-warning);
        --bs-tooltip-color: var(--bs-tooltip-color-dark);
    }

    .bb-tooltip-info {
        --bs-tooltip-bg: var(--bs-tooltip-info);
        --bs-tooltip-color: var(--bs-tooltip-color-dark);
    }

    .bb-tooltip-light {
        --bs-tooltip-bg: var(--bs-tooltip-light);
        --bs-tooltip-color: var(--bs-tooltip-color-dark);
    }

    .bb-tooltip-dark {
        --bs-tooltip-bg: var(--bs-tooltip-dark);
        --bs-tooltip-color: var(--bs-tooltip-color-white);
    }

    /*Sonner */
    .sonner {
        background-color: var(--bs-body-bg);
        display: flex;
        flex-direction: row;
        gap: 1rem;
        padding: 1rem;
        border-radius: var(--bs-border-radius);
        border: 1px solid var(--bs-border-color);
        align-items: center;
        position: fixed;
        visibility: hidden;
        right: 2rem;
        bottom: 2rem;
        z-index: 9999;
        box-shadow: var(--bs-box-shadow);
        min-width: 340px;
    }

    .sonner-content {
        display: flex;
        flex-direction: column;
        gap: 0.25rem;
    }

        .sonner-content b {
            font-weight: var(--bs-font-weight-semibold);
            font-size: var(--bs-body-font-size);
        }

        .sonner-content p {
            font-weight: var(--bs-body-font-weight);
            opacity: 0.65;
            font-size: var(--bs-body-font-size-sm);
        }

    .light .sonner {
        box-shadow: var(--bs-box-shadow-sm);
    }


    .show {
        visibility: visible;
        /*animation: show-b 200ms ease-in-out forwards;*/
    }

    .hide {
        visibility: visible;
        /*animation: hide-b 200ms ease-in-out forwards;*/
    }
    /*@keyframes show-b {
    from {
        opacity: 0;
        transform: translateY(100%)
    }

    to {
        opacity: 1;
        transform: translateY(0)
    }
}



@keyframes hide-b {
    from {
        opacity: 1;
        transform: translateY(0)
    }

    to {
        opacity: 0;
        transform: translateY(100%)
    }
}*/

    /*ScrollArea */
    .scroll-area-vertical {
        display: flex;
        gap: 6px;
        flex-direction: column;
        border: 1px solid var(--primary-border);
        border-radius: 6px;
        overflow: hidden;
        overflow-y: auto;
        scrollbar-gutter: stable;
        scroll-behavior: smooth;
    }

    .scroll-area-horizontal {
        display: flex;
        gap: 6px;
        border: 1px solid var(--primary-border);
        border-radius: 6px;
        overflow: hidden;
        overflow-x: auto;
        scrollbar-gutter: stable;
        scroll-behavior: smooth;
    }