﻿/*This sheet is for modifications to existing 3rd-party classes*/


/*---------------------START | METRONIC8---------------------*/

/*Form Validation highlight*/

:root {
    --bs-form-invalid-color: var(--bs-danger);
    --bs-form-invalid-border-color: var(--bs-danger);
}

.invalid {
    border-color: var(--bs-form-invalid-border-color) !important;
}

.form-control.invalid:focus:not(.disabled):not(.border-0), .form-select.invalid:focus:not(.disabled):not(.border-0), .form-check.invalid:focus:not(.disabled):not(.border-0) {
    border-color: var(--bs-form-invalid-border-color) !important;
    box-shadow: 0 0 0 0.25rem var(--bs-danger-clarity) !important;
}

.input-group > .form-floating:first-child > .form-control, .input-group > .form-floating:first-child > .form-select {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.validation-message {
    color: var(--bs-form-invalid-color);
}

.blazor-error-boundary {
    background: var(--bs-danger);
    border: 1.4px solid var(--bs-danger);
    padding: 1rem 1rem 1rem 3.7rem;
    color: var(--bs-danger-inverse);
    border-radius: 0.665rem;
    margin-bottom: 1.25rem;
    width: fit-content;
    box-shadow: var(--bs-box-shadow);
}

    .blazor-error-boundary::after {
        content: "Whoops! An error has occurred.";
        font-weight: bold;
        font-family: "Inter", "Noto Color Emoji", Helvetica, "sans-serif" !important;
    }

/*Turn multi-step wizard stepper into dynamic preview panel*/
/*Add .stepper-preview to existing templates with a div.stepper-multistep, then customize HTML in each .step-wrapper*/
.stepper-preview.stepper-multistep .stepper-item:not(.current) {
    display: none !important;
}

/*Fix for constant heights*/
@media (min-width: 992px) {
    .container-xxl {
        height: 100%;
    }
}

/*Prevent Cumulative Shift when body loads*/
body:not(.loaded) .wrapper,
body:not(.loaded) .app-wrapper {
    transition: none !important;
}

/* Automatically space stacked cards within columns to match the gutter set by the parent row*/
.container-xxl .row div .card:not(:only-child):not(:last-child) {
    margin-bottom: var(--bs-gutter-y)
}

.container-xxl .card.card-stretch {
    height: 100% !important;
}

.container-xxl .card.card-stretch {
    height: 100% !important;
}

.container-xxl .card.card-stretch-75:last-child {
    height: 75% !important;
}

.container-xxl .card.card-stretch-50:last-child {
    height: 50% !important;
}

.container-xxl .card.card-stretch-33:last-child {
    height: 33.3333% !important;
}

.container-xxl .card.card-stretch-25:last-child {
    height: 25% !important;
}


/*Default State for Community Icon*/
.ki-solid.ki-community:before {
    content: "\e914";
}

.ki-community .path1:before {
    content: "\e927";
    opacity: 0.3;
}

.ki-community .path2:before {
    content: "\e928";
    position: absolute;
    left: 0;
}

/*Card Title Spacing*/
.card .card-header .card-title,
.card .card-header .card-toolbar,
.card .card-header > * {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

.card .card-header {
    gap: 0.5rem;
}

/*Clarify value and usage of --bs-text-muted*/
[data-bs-theme=light], [data-bs-theme=dark] {
    --bs-text-muted: var(--bs-gray-600);
}

.form-check-label {
    color: var(--bs-text-muted);
}

/*FlatCaledar Edits*/
.flatpickr-calendar {
    border: 1.4px solid var(--bs-gray-300);
}

    .flatpickr-calendar.hasTime.noCalendar {
        max-width: 100vw;
        width: 150px;
        padding-right: 1rem;
    }

/*Masonry Workaround*/
.masonry {
    columns: 3 200px;
}

.masonry-2 {
    columns: 2 200px;
}

.masonry-3 {
    columns: 3 200px;
}

.masonry-4 {
    columns: 4 200px;
}

.masonry-5 {
    columns: 5 200px;
}

.masonry-6 {
    columns: 6 200px;
}


/*Bootstrap Navbar edits*/
.navbar-toggler {
    padding: 0.25rem;
    border: none !important;
    box-shadow: none !important;
    border-radius: 0.475rem !important;
}

    .navbar-toggler:hover i.ki-duotone, .navbar-toggler[aria-expanded="true"] i.ki-duotone {
        color: var(--bs-primary) !important;
    }

    .navbar-toggler:hover, .navbar-toggler[aria-expanded="true"] {
        padding: 0.25rem;
        color: var(--bs-primary);
        background-color: var(--bs-primary-light);
    }

        .navbar-toggler[aria-expanded="true"]:hover {
            opacity: 75%
        }

/*Remove colored background from floating labels on solid field inputs*/
.form-floating > .form-control.form-control-solid:focus ~ label::after,
.form-floating > .form-control.form-control-solid:not(:placeholder-shown) ~ label::after,
.form-floating > .form-control-plaintext.form-control-solid ~ label::after,
.form-floating > .form-select.form-select-solid ~ label::after {
    background-color: var(--bs-gray-100);
}

/*Semitransparent Form Inputs for use on backgrounds*/
.form-control.form-control-special::placeholder,
.form-control.form-control-special.form-control-solid::placeholder {
    color: #ffffff80 !important;
}

.form-control.form-control-special,
.form-control.form-control-special.form-control-solid {
    background-color: #ffffff69 !important;
}

/*Add Focus-Within to form-control-solid divs that wrap 3rd-party inputs*/
div.form-control.form-control-solid:focus-within {
    background-color: var(--bs-gray-200);
    border-color: var(--bs-gray-200);
    color: var(--bs-gray-700);
    transition: color 0.2s ease;
}

/*Fix vertical spacing on floating form labels*/
.form-floating > label {
    line-height: 1.75;
    font-weight: 500;
}

.form-floating > .form-control:focus ~ label,
.form-floating > .form-control:not(:placeholder-shown) ~ label,
.form-floating > .form-control-plaintext ~ label,
.form-floating > .form-select ~ label {
    line-height: 1.5;
}

.form-floating .form-select {
    line-height: 1.25
}

.form-floating > .form-control:focus ~ label.required::after,
.form-floating > .form-control:not(:placeholder-shown) ~ label.required::after,
.form-floating > .form-control-plaintext ~ label.required::after,
.form-floating > .form-select ~ label.required::after {
    content: "*";
    left: calc(100% - 14px);
    background-color: transparent;
}

.form-floating > .form-control:focus ~ label::after,
.form-floating > .form-control:not(:placeholder-shown) ~ label::after,
.form-floating > .form-control-plaintext ~ label::after,
.form-floating > .form-select ~ label::after {
    background-color: transparent;
}

/*Prevent footer from losing contrast when page background color is themed*/
@media (min-width: 992px) {
    div#kt_footer {
        padding: 2rem 30px 1rem 30px !important;
    }

    body.themed-bg div#kt_footer {
        max-width: 1320px;
        margin-left: auto;
        margin-right: auto;
        width: 100%;
    }

        body.themed-bg div#kt_footer .container-xxl {
            border-radius: 0.65rem;
            border: var(--bs-aside-border) !important;
            box-shadow: 0 2px 4px -2px rgba(10, 13, 18, 0.04), 0 4px 8px -2px rgba(10, 13, 18, 0.06);
            background: var(--bs-body-bg);
        }
}

body.themed-bg div#kt_footer .container-xxl {
    padding: 0.5rem 1rem !important;
}

@media (max-width: 991px) {
    body.themed-bg div#kt_footer .container-xxl {
        border: var(--bs-aside-border) !important;
        box-shadow: 0 2px 4px -2px rgba(10, 13, 18, 0.04), 0 4px 8px -2px rgba(10, 13, 18, 0.06);
        background: var(--bs-body-bg);
        padding: 0.5rem 1rem 8rem 1rem !important;
    }
}

/*Prevent overlapping borders inside button groups*/
.input-group .input-group-text.btn {
    z-index: 1;
}

    .input-group .input-group-text.btn.active {
        z-index: 2;
    }

/*Prevent symbol content from overflowing the symbol itself*/
.symbol > img, .symbol .symbol-label:after {
    border-radius: inherit;
}

/*Disable first button on Metronic8 lightbox*/
.fslightbox-toolbar-button:first-child {
    display: none;
}

/*Unstick cardnavs on small screens*/
@media (max-width: 991px) {
    .unstick-me {
        position: relative !important;
        top: unset !important;
        left: unset !important;
        width: 100% !important;
    }

        .unstick-me .card-body.hover-scroll-y {
            max-height: unset !important;
        }
}

/*--Menu arrow fixes and customizations---*/
.menu-arrow.text-muted::after {
    background-color: var(--bs-text-muted) !important
}

.menu-item.menu-accordion .menu-arrow:after {
    transform: rotateZ(0deg) !important;
}

.menu-item.menu-accordion.showing:not(.menu-dropdown) > .menu-link .menu-arrow:after, .menu-item.menu-accordion.show:not(.hiding):not(.menu-dropdown) > .menu-link .menu-arrow:after {
    transform: rotateZ(90deg) !important;
}

.nav-link.active:not(.show) > .rotate-180, .nav-slider .active:not(.show) > .rotate-180 {
    transform: unset !important;
    transition: transform .3s ease;
}

.nav-link .active.show > .rotate-180, .nav-slider .active.show > .rotate-180 {
    transform: rotateZ(180deg) !important;
    transition: transform .3s ease;
}

/*Image Input Wrappers*/

.image-input-wrapper {
    border: 2px solid var(--bs-gray-300);
    overflow: hidden;
}


    .image-input-placeholder.image-input-empty {
        background-image: url('https://wavoto-community.s3.dualstack.us-east-1.amazonaws.com/templates/2001/media/svg/files/blank-image.svg');
    }

    [data-bs-theme="dark"] .image-input-placeholder.image-input-empty {
        background-image: url('https://wavoto-community.s3.dualstack.us-east-1.amazonaws.com/templates/2001/media/svg/files/blank-image-dark.svg');
    }

    [data-bs-theme="dark"] .image-input-placeholder {
        background-color: var(--bs-body-bg);
    }
    /*Misc. class patches*/
    .table {
        --bs-table-bg: var(--bs-body-bg);
    }

    tr:not(.addZIndex) [aria-hidden="true"] {
        display: none !important;
    }

    .form-select {
        white-space: nowrap;
    }

    .menu-item {
        user-select: none;
    }

    .rounded {
        overflow: hidden;
    }

    .col-form-label {
        padding-top: 0;
    }

    blockquote {
        border-left: solid 3px var(--bs-gray-300);
        margin: 1rem 0;
        padding-left: 1rem;
    }


    .badge {
        --bs-badge-font-weight: 500;
        gap: 0.5rem;
        line-height: 0.75rem;
        cursor: default;
    }


        .badge.badge-lg {
            line-height: 1.2rem;
        }

        .badge.badge-sm {
            line-height: 0.5rem;
        }

        .badge > i {
            margin-right: 0 !important;
            padding-right: 0 !important;
            margin-left: 0 !important;
            padding-left: 0 !important;
        }

        .badge i.ki-duotone, .btn i.ki-duotone, .badge i.ki-solid, .btn i.ki-solid {
            color: inherit;
        }

    a, a label {
        cursor: pointer !important;
    }

    .cursor-text {
        cursor: text !important;
    }

    .tagify .bg-primary {
        color: #fff;
    }

    .separator.separator-content::before,
    .separator.separator-content::after {
        border-bottom-width: 1.4px;
    }

    .tooltip {
        --bs-tooltip-zindex: 100080;
    }
    /*---------------------END | METRONIC8---------------------*/
    /*---------------------START | MISC. DARK MODE EDITS---------------------*/
    /*Dropdown Backgrounds in Dark Mode*/
    [data-bs-theme=dark] {
        --bs-menu-dropdown-bg-color: var(--bs-gray-200);
    }

        [data-bs-theme=dark] .menu-sub-dropdown .separator {
            border-bottom: 1.4px solid var(--bs-gray-400);
        }
    /*---------------------END | MISC. DARK MODE EDITS---------------------*/
    /*---------------------START | SYNCFUSION [Needs cleaning]---------------------*/
    /*Suppress clickable tooltips on mobile*/
    @media (max-width: 767px) {
        .tooltip.tooltip-blocker, .tooltip.tooltip-blocker.show {
            display: none !important;
        }
    }

    .tooltip.tooltip-blocker.show {
        pointer-events: none;
    }
    /*---SYNCFUSION BUTTONS AND INPUTS---*/
    .e-dialog .e-dialog {
        position: fixed !important;
        left: 50% !important;
        top: 50% !important;
        transform: translate(-50%, -50%);
        box-shadow: var(--bs-menu-dropdown-box-shadow);
    }

    .e-btn-group:not(.e-outline), .e-css.e-btn-group:not(.e-outline) {
        box-shadow: none !important;
    }

    .e-btn-group input:checked + label.e-btn.btn-outline-secondary, .e-css.e-btn-group input:checked + label.e-btn.btn-outline-secondary {
        background: var(--bs-gray-200);
        border-color: var(--bs-gray-400);
    }

        .e-btn-group input:checked + label.e-btn.btn-outline-secondary, .e-btn-group input:checked + label.e-btn.btn-outline-secondary > i, .e-btn-group input:hover + label.e-btn.btn-outline-secondary, .e-btn-group input:hover + label.e-btn.btn-outline-secondary > i {
            color: var(--bs-gray-800) !important;
        }

    textarea.member-input {
        outline: none !important;
        border: none !important;
    }
    /*---HIDE EMOJI INPUT ON MOBILE RTEs---*/
    @media (max-width: 767px) {
        .create-post-input .e-rte-custom-toolbar[data-index="5"], #kt_convo_chat_footer .e-rte-custom-toolbar[data-index="5"] {
            display: none !important;
        }
    }

    @media (max-width: 567px) {
        .e-toolbar-item.e-separator {
            display: none !important;
        }
    }

    .e-rte-elements input.e-input, .e-rte-elements .e-input-group input.e-input, .e-rte-elements .e-input-group.e-control-wrapper input.e-input, .e-rte-elements .e-input-group textarea.e-input, .e-rte-elements .e-input-group.e-control-wrapper textarea.e-input, .e-rte-elements textarea.e-input, .e-rte-elements .e-float-input input, .e-rte-elements .e-float-input.e-control-wrapper input, .e-rte-elements .e-float-input textarea, .e-rte-elements .e-float-input.e-control-wrapper textarea {
        font-weight: 400;
        color: var(--bs-gray-900);
        border: 1.4px solid var(--bs-gray-300);
        font-family: var(--bs-body-font-family) !important;
        border-radius: 0.5rem !important;
        background-color: var(--bs-body-bg);
    }

    .e-input-group, .e-input-group.e-control-wrapper, .e-float-input, .e-float-input.e-input-group, .e-float-input.e-control-wrapper, .e-float-input.e-input-group.e-control-wrapper, .e-input-group:not(.e-success):not(.e-warning):not(.e-error), .e-input-group.e-control-wrapper:not(.e-success):not(.e-warning):not(.e-error) {
        background-color: var(--bs-body-bg);
        color: var(--bs-gray-900);
        border-color: var(--bs-gray-300);
    }

    .e-dialog .e-img-uploadwrap .e-droptext, .e-dialog .e-aud-uploadwrap .e-droptext, .e-dialog .e-vid-uploadwrap .e-droptext, .e-dialog .e-word-uploadwrap .e-droptext, .e-dialog .e-device .e-vid-uploadwrap .e-droptext {
        border-radius: 0.5rem;
    }

    .e-dialog .e-label {
        font-family: var(--bs-body-font-family) !important;
        color: var(--bs-gray-700);
    }

    .e-checkbox-wrapper:hover .e-label, .e-css.e-checkbox-wrapper:hover .e-label {
        color: var(--bs-gray-600);
    }

    .e-rte-elements input.e-input, .e-rte-elements .e-input-group input.e-input, .e-rte-elements .e-input-group.e-control-wrapper input.e-input, .e-rte-elements .e-input-group textarea.e-input, .e-rte-elements .e-input-group.e-control-wrapper textarea.e-input, .e-rte-elements textarea.e-input, .e-float-input input, .e-float-input.e-control-wrapper input, .e-rte-elements .e-float-input textarea, .e-float-input.e-control-wrapper textarea {
        min-height: 1.75rem;
        height: unset;
        padding: 0.775rem 1rem !important;
        font-family: var(--bs-body-font-family) !important;
        border-width: 1.4px;
        border-radius: 0.5rem;
    }

    .e-maskedtextbox {
        letter-spacing: 0.075rem;
    }

    .e-dialog .form-switch.form-check-solid .form-check-input:not(:checked) {
        background-color: var(--bs-gray-400);
    }

    .e-dialog .e-control, .e-dialog .e-css, .e-dialog .e-error, .e-dialog .e-btn, .e-dialog .e-css.e-btn, .e-dialog .e-primary.e-btn, .e-dialog .e-img-uploadwrap .e-droptext, .e-dialog .e-aud-uploadwrap .e-droptext, .e-dialog .e-vid-uploadwrap .e-droptext, .e-dialog .e-word-uploadwrap .e-droptext, .e-dialog.e-device .e-vid-uploadwrap .e-droptext, .e-richtexteditor .e-linkheader, .e-richtexteditor .e-audioheader, .e-richtexteditor .e-videoheader, .e-richtexteditor .e-video-url-wrap, .e-rte-elements .e-linkheader, .e-rte-elements .e-audioheader, .e-rte-elements .e-videoheader, .e-rte-elements .e-video-url-wrap, .e-dialog .e-label {
        font-family: var(--bs-body-font-family) !important;
    }

    .e-rte-elements .e-input:focus:not(.e-success):not(.e-warning):not(.e-error), .e-rte-elements .e-float-input:not(.e-success):not(.e-warning):not(.e-error):not(.e-input-group) input:focus, .e-rte-elements .e-float-input:not(.e-success):not(.e-warning):not(.e-error):not(.e-input-group) textarea:focus, .e-rte-elements .e-float-input.e-control-wrapper:not(.e-success):not(.e-warning):not(.e-error):not(.e-input-group) input:focus, .e-rte-elements .e-float-input.e-control-wrapper:not(.e-success):not(.e-warning):not(.e-error):not(.e-input-group) textarea:focus, .e-rte-elements .e-float-input:not(.e-success):not(.e-warning):not(.e-error):not(.e-input-group).e-input-focus input, .e-rte-elements .e-float-input.e-control-wrapper:not(.e-success):not(.e-warning):not(.e-error):not(.e-input-group).e-input-focus input {
        box-shadow: 0px 0px 0px 4px var(--bs-primary-clarity) !important;
        border: 1.4px solid var(--bs-primary-300);
    }

    .e-rte-linkcontent .e-rte-label {
        margin-bottom: 2px;
    }

    .e-dialog .e-btn, .e-dialog .e-css.e-btn, .e-dialog .e-primary.e-btn, .e-dialog .e-btn.e-flat.e-primary:disabled, .e-dialog .e-btn.e-flat.e-primary.e-disabled, .e-dialog .e-css.e-btn.e-flat.e-primary:disabled, .e-dialog .e-css.e-btn.e-flat.e-primary.e-disabled, .e-dialog .e-btn.e-primary.e-flat:not([DISABLED]):not(.e-success):not(.e-danger):not(.e-warning):not(.e-info), .e-dialog .e-footer-content .e-btn.e-primary.e-flat:not([DISABLED]):not(.e-success):not(.e-danger):not(.e-warning):not(.e-info) {
        color: var(--bs-primary-inverse);
        border-color: var(--bs-primary);
        background-color: var(--bs-primary);
        box-shadow: none !important;
        border-radius: 0.5rem !important;
        font-weight: var(--bs-btn-font-weight);
        padding: calc(0.55rem + 1.4px) calc(1rem + 1.4px);
        font-weight: 500;
    }

        .e-dialog .e-btn:hover, .e-dialog .e-css.e-btn:hover .e-dialog .e-btn:active, .e-dialog .e-css.e-btn:active .e-dialog .e-btn:focus, .e-dialog .e-css.e-btn:focus {
            color: var(--bs-primary-inverse);
            border-color: var(--bs-primary-active);
            background-color: var(--bs-primary-active) !important;
        }

        .e-dialog .e-cancel.e-btn, .e-dialog .e-btn.e-flat.e-cancel:disabled, .e-dialog .e-btn.e-flat.e-cancel.e-disabled, .e-dialog .e-css.e-btn.e-flat.e-cancel:disabled, .e-dialog .e-css.e-btn.e-flat.e-cancel.e-disabled, .e-dialog .e-footer-content .e-btn.e-flat:not([DISABLED]):not(.e-success):not(.e-danger):not(.e-warning):not(.e-info):not(.e-primary) {
            background-color: var(--bs-body-bg) !important;
            border: 1.4px solid var(--bs-gray-300) !important;
            color: var(--bs-gray-700) !important;
        }

            .e-dialog .e-cancel.e-btn:hover, .e-dialog .e-cancel.e-css.e-btn:hover, .e-dialog .e-footer-content .e-btn.e-flat:not([DISABLED]):not(.e-success):not(.e-danger):not(.e-warning):not(.e-info):not(.e-primary):hover, .e-dialog .e-cancel.e-btn:active, .e-dialog .e-cancel.e-css.e-btn:active, .e-dialog .e-footer-content .e-btn.e-flat:not([DISABLED]):not(.e-success):not(.e-danger):not(.e-warning):not(.e-info):not(.e-primary):active, .e-dialog .e-cancel.e-btn:focus, .e-dialog .e-cancel.e-css.e-btn:focus, .e-dialog .e-footer-content .e-btn.e-flat:not([DISABLED]):not(.e-success):not(.e-danger):not(.e-warning):not(.e-info):not(.e-primary):focus {
                background-color: var(--bs-gray-50) !important;
                border: 1.4px solid var(--bs-gray-300) !important;
                color: var(--bs-gray-700) !important;
            }

        .e-dialog .e-btn.disabled, .e-dialog .e-btn.e-disabled, .e-dialog .e-css.e-btn:disabled, .e-dialog .e-css.e-disabled {
            opacity: 0.5;
        }

    .e-dialog .e-radio + label::before, .e-dialog .e-checkbox-wrapper .e-frame, .e-dialog .e-css.e-checkbox-wrapper .e-frame {
        border-width: 1.4px;
        box-shadow: none !important;
    }

        .e-dialog .e-radio:checked + label::before, .e-dialog .e-radio:checked + label:hover::before, .e-dialog .e-checkbox-wrapper .e-frame.e-check, .e-dialog .e-css.e-checkbox-wrapper .e-frame.e-check {
            background-color: var(--bs-primary) !important;
            border-color: var(--bs-primary) !important;
        }

    .e-dialog .e-checkbox-wrapper .e-checkbox:focus + .e-frame, .e-dialog .e-checkbox-wrapper .e-checkbox:active + .e-frame, .e-dialog .e-css.e-checkbox-wrapper .e-checkbox:focus + .e-frame, .e-dialog .e-css.e-checkbox-wrapper .e-checkbox:active + .e-frame {
        border-color: var(--bs-primary) !important;
    }

    .e-dialog .e-radio:not(:checked) + label:hover::before {
        background-color: var(--bs-primary-light);
        border-color: var(--bs-primary);
    }

    .e-dialog .e-btn.e-icon-btn {
        background-color: transparent !important;
    }

    .e-dialog .e-dlg-header-content .e-btn.e-dlg-closeicon-btn:hover, .e-dialog .e-dlg-header-content .e-btn.e-dlg-closeicon-btn:focus, .e-dialog .e-dlg-header-content .e-btn.e-dlg-closeicon-btn:active {
        color: var(--bs-primary)
    }

    .e-dialog .e-dlg-header-content .e-btn.e-dlg-closeicon-btn {
        color: var(--bs-body-color)
    }

    .e-dialog .e-btn.e-dlg-closeicon-btn:hover span {
        color: inherit !important;
    }
    /*----SYNCFUSION RTE UPLOAD FOOTER----*/
    .e-rte-elements .e-footer-content {
        display: flex !important;
        justify-content: flex-end;
    }

        .e-rte-elements .e-footer-content > .e-cancel, .e-rte-elements .e-footer-content .e-btn.e-flat:not([DISABLED]):not(.e-success):not(.e-danger):not(.e-warning):not(.e-info):not(.e-primary) {
            order: 1;
        }

        .e-rte-elements .e-footer-content > :not(.e-cancel) {
            order: 2;
        }

    .e-dialog .e-footer-content {
        border-top: 1px solid var(--bs-gray-300) !important;
    }
    /*---RTE Colors----*/
    .e-input-group, .e-input-group.e-control-wrapper, .e-float-input, .e-float-input.e-input-group, .e-float-input.e-control-wrapper, .e-float-input.e-input-group.e-control-wrapper {
        color: var(--bs-body-color)
    }
    /*----MENU CHEAT----*/
    .menu .separator:last-child {
        display: none;
    }

    .menu-link::selection, .menu-title::selection, .menu-arrow::selection, .menu-link::-moz-selection, .menu-title::-moz-selection, .menu-arrow::-moz-selection {
        background: transparent;
    }
    /*---Customizations for Post Comments and Reply-in-thread---*/
    .post-comments {
        overflow-x: hidden;
    }

    .open-thread .menu-sub .comment-block {
        position: relative;
        z-index: 1;
    }

        .open-thread .menu-sub .comment-block::before {
            background-color: var(--bs-gray-300);
            position: absolute;
            content: '';
            width: 200%;
            height: 100%;
            z-index: -1;
            left: -50%;
            opacity: 0%;
            top: 0;
            pointer-events: none;
        }

        .open-thread .menu-sub .comment-block:hover::before, .open-thread .menu-sub .comment-block:focus-within::before {
            opacity: 30%;
        }
    /*---GLOBAL MODAL CUSTOMIZATIONS----*/
    @media (min-width: 768px) {
        body.e-dlg-target.e-scroll-disabled, .fslightbox-open body {
            padding-right: 15px;
        }
    }

    .e-dialog {
        border-radius: 1rem;
        max-width: calc(100% - 30px);
    }

    @media (max-width: 991px) {
        .e-dialog {
            max-width: calc(100% - 8px);
        }
    }

    .e-dlg-overlay {
        background-color: rgba(0, 0, 0, .3);
        backdrop-filter: blur(4px);
    }

    .e-dialog:not(.settings-modal-unflush) .e-dlg-header-content {
        border: none !important
    }

    .e-dlg-content, .e-dlg-header-content {
        padding: 24px !important;
    }

    .e-dlg-content, .e-dialog .e-footer-content, .e-dlg-header-content {
        padding: 16px 24px !important;
    }

    .e-dialog:not(.settings-modal-unflush):not(.modalShareLink) .e-dlg-header-content {
        padding-bottom: 0.475rem !important;
    }

    .e-dialog:not(.settings-modal-unflush) .e-dlg-header-content + .e-dlg-content {
        padding-top: 24px !important;
    }

    .e-dialog .e-dlg-header {
        white-space: pre-line;
    }

    .e-dlg-header, .e-dlg-header * {
        color: var(--bs-body-color)
    }

    .e-dialog, .e-dialog-header, .e-dlg-content {
        background-color: var(--bs-body-bg);
        color: var(--bs-body-color);
        border-color: var(--bs-root-card-border-color);
    }
        /*-----Stifle height on settings modals-----*/
        .e-dialog.settings-modal-height {
            max-height: 80vh !important;
        }
    /*---Remove rounding on modal overlay backgrounds---*/
    .e-dlg-container, .e-dlg-container.rounded {
        border-radius: 0 !important;
    }
    /*-----modalConfirm Customizations----*/
    .modalConfirm .e-dialog .e-footer-content {
        border: none !important;
        padding-top: 0px !important;
    }
    /*-----modalCustomQuickActions Customizations----*/
    .modalCustomQuickActions .e-dialog .e-footer-content {
        border: none !important;
    }

    .modalCustomQuickActions .e-dialog:not(.settings-modal-unflush) .e-dlg-header-content + .e-dlg-content {
        padding-top: 0 !important;
    }
    /*---modalShareLink Customizations---*/
    .modalShareLink .e-dlg-header-content {
        padding: 0 !important;
    }
    /*---Course Content Modal RTE Customizations-----*/
    .course-rte .e-rte-container, .course-rte .e-rte-container .e-rte-content, .course-rte .e-rte-container .e-rte-content .e-content {
        display: flex !important;
        flex-direction: column !important;
        flex-grow: 1 !important;
        height: 100%;
    }
    /*---modalPickAsset Customizations----*/
    .modalPickAsset.e-dlg-modal {
        max-height: 90vh !important;
        height: 90vh !important;
    }

    .modalPickAsset .e-dlg-content, .modalPickAsset .e-dlg-content section, .modalPickAsset .e-dlg-content .row, .modalPickAsset .e-dlg-content .row > div {
        max-height: inherit;
        height: 100%;
    }

    .modalPickAsset.e-dialog .e-dlg-content {
        overflow: hidden !important;
        padding: 0 !important;
    }

    .modalPickAsset #assets_scrollable {
        max-height: calc(90vh - 79px);
    }

    .modalPickAsset span.system-folder-note::after {
        content: 'system folder';
        padding-left: 1rem;
        color: var(--bs-text-gray-500) !important;
        font-weight: 400;
        opacity: 0;
        pointer-events: none;
    }

    .modalPickAsset a:hover span.system-folder-note::after {
        opacity: 100;
    }

    @media (max-width: 991px) {
        .e-dialog.create-post-modal {
            max-height: 98vh !important;
            height: 100% !important;
        }
    }

    .create-post-modal > .e-dlg-content {
        padding-bottom: 0 !important;
    }

    .create-post-modal .create-post-input {
        margin-bottom: 24px;
    }

    .post-content > * {
        margin-bottom: 1rem !important;
    }

        .post-content > *:last-child, .post-content > p:last-child {
            margin-bottom: 0rem !important;
        }

    .e-richtexteditor, .e-richtexteditor .e-rte-content, .e-richtexteditor .e-source-content {
        color: var(--bs-body-color);
        background: transparent !important;
    }

        .e-richtexteditor .e-rte-placeholder {
            color: var(--bs-body-color);
        }

    .e-toolbar .e-hor-nav {
        border-top-right-radius: 0.425rem;
        color: var(--bs-gray-800)
    }

        .e-toolbar .e-hor-nav:hover {
            background: var(--bs-gray-100);
            color: var(--bs-gray-900)
        }

            .e-toolbar .e-hor-nav:hover:active, .e-toolbar .e-hor-nav:active, .e-toolbar .e-hor-nav:focus {
                background: var(--bs-gray-200);
                color: var(--bs-gray-800)
            }

    .e-toolbar .e-toolbar-items .e-toolbar-left .e-toolbar-item:first-child, .e-toolbar .e-toolbar-items:not(.e-tbar-pos):not(.e-toolbar-multirow) .e-toolbar-item:first-child {
        margin-left: 0
    }

    .e-toolbar.e-rte-toolbar:not(.e-rte-quick-toolbar), div#rteConversationMessageID_toolbar_container, div#rtePostMessageID_toolbar_container {
        background: transparent;
        border-top-left-radius: var(--bs-border-radius) !important;
        border-top-right-radius: var(--bs-border-radius) !important;
        border-color: transparent;
    }

        .e-toolbar.e-rte-toolbar:not(.e-rte-quick-toolbar)::before {
            background-color: var(--bs-body-bg);
            position: absolute;
            left: 0.5rem;
            width: calc(100% - 1rem);
            height: 100%;
            content: '';
            z-index: -1;
            top: 0;
            pointer-events: none;
        }

    .e-richtexteditor .e-rte-content .e-content, .e-richtexteditor .e-source-content .e-content {
        min-height: unset;
    }

    .e-richtexteditor .e-rte-content, .e-richtexteditor .e-source-content {
        color: var(--bs-body-color);
    }

    .e-toolbar .e-toolbar-items, .e-rte-content, .e-richtexteditor, .e-rte-container {
        background: transparent;
    }

        .e-richtexteditor .e-toolbar .e-toolbar-item .e-tbar-btn.e-btn, .e-richtexteditor .e-toolbar .e-rte-dropdown-btn {
            border-radius: 0.475rem !important;
            box-shadow: none !important;
            background: transparent;
            border-color: transparent;
        }

        .e-richtexteditor .e-toolbar .e-rte-dropdown-btn {
            padding-top: 0px;
            padding-bottom: 0px;
            height: 100%;
            min-height: 32px;
        }

            .e-richtexteditor .e-toolbar .e-rte-dropdown-btn .e-icons.e-btn-icon {
                margin: 0;
                min-width: 12px;
                width: auto;
                line-height: 14px;
                font-size: 14px
            }

            .e-richtexteditor .e-toolbar .e-rte-dropdown-btn .e-icons.e-caret {
                font-size: 12px
            }

    .e-rte-container {
        border-color: transparent;
    }

    .create-post-input:focus-within {
        border-color: var(--bs-primary-300);
        box-shadow: 0 0 0px 4px var(--bs-primary-clarity);
    }

    .e-rte-placeholder {
        line-height: 1.5;
        opacity: .50;
        overflow: hidden;
        padding: 16px;
        position: absolute;
        text-align: start;
        top: 0;
        z-index: 1;
        display: none
    }

        .e-rte-placeholder.e-placeholder-enabled {
            display: block
        }

    .e-rte-toolbar:not(.e-rte-quick-toolbar) .e-toolbar-items.e-toolbar-multirow {
        margin-left: 0px !important;
    }

    .e-rte-toolbar.e-rte-quick-toolbar {
        border-radius: var(--bs-border-radius) !important;
    }

        .e-rte-toolbar.e-rte-quick-toolbar .e-toolbar-items {
            margin-left: 0 !important;
            margin-right: 0px !important;
        }

    .e-richtexteditor .e-rte-toolbar .e-toolbar-item .e-rte-dropdown-menu:not(:hover):not(:focus):not(:active):not(.e-active) {
        background-color: transparent
    }

    .e-richtexteditor .e-toolbar .e-toolbar-item .e-tbar-btn.e-btn {
        border-radius: 0.475rem !important;
        box-shadow: none !important;
        background: transparent
    }

    .e-richtexteditor .e-toolbar .e-toolbar-item .e-tbar-btn:hover, .e-richtexteditor .e-toolbar .e-toolbar-item .e-tbar-btn:active, .e-richtexteditor .e-toolbar .e-toolbar-item .e-tbar-btn:focus, .e-richtexteditor .e-toolbar .e-toolbar-item.e-active .e-tbar-btn {
        background: var(--bs-gray-200) !important;
    }

    .e-richtexteditor .e-toolbar .e-toolbar-item .e-tbar-btn:hover, .e-richtexteditor .e-toolbar .e-toolbar-item .e-tbar-btn:active, .e-richtexteditor .e-toolbar .e-toolbar-item .e-tbar-btn:focus, .e-richtexteditor .e-toolbar .e-toolbar-item .e-tbar-btn.e-active, .e-richtexteditor .e-toolbar .e-toolbar-item.e-active .e-tbar-btn, .e-richtexteditor .e-toolbar .e-rte-dropdown-btn.e-active, .e-richtexteditor .e-toolbar .e-rte-dropdown-btn:hover, .e-richtexteditor .e-toolbar .e-rte-dropdown-btn:active, .e-richtexteditor .e-toolbar .e-rte-dropdown-btn:focus {
        background: var(--bs-gray-200) !important;
    }

    .e-toolbar .e-toolbar-item.e-overlay {
        color: unset;
        background: unset;
    }

        .e-toolbar .e-toolbar-item.e-overlay + .e-rte-custom-toolbar {
            opacity: 0.5;
            pointer-events: none;
        }

    .e-toolbar .e-toolbar-item .e-tbar-btn, .e-richtexteditor .e-rte-toolbar .e-toolbar-item .e-rte-dropdown-menu, .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-item .e-rte-dropdown-menu, .e-richtexteditor .e-rte-toolbar .e-toolbar-item .e-tbar-btn .e-icons, .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-item .e-tbar-btn .e-icons, .e-toolbar .e-toolbar-item .e-tbar-btn .e-tbar-btn-text {
        color: var(--bs-gray-700) !important;
    }

    .e-richtexteditor .e-rte-toolbar .e-toolbar-item .e-rte-dropdown-menu {
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }

        .e-richtexteditor .e-rte-toolbar .e-toolbar-item .e-rte-dropdown-menu:hover, .e-richtexteditor .e-rte-toolbar .e-toolbar-item .e-rte-dropdown-menu:focus, .e-richtexteditor .e-rte-toolbar .e-toolbar-item .e-rte-dropdown-menu:active, .e-richtexteditor .e-rte-toolbar .e-toolbar-item .e-rte-dropdown-menu.e-active, .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-item .e-rte-dropdown-menu:hover, .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-item .e-rte-dropdown-menu:focus, .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-item .e-rte-dropdown-menu:active, .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-item .e-rte-dropdown-menu.e-active {
            background-color: var(--bs-gray-200) !important;
        }

        .e-richtexteditor .e-rte-toolbar .e-toolbar-item .e-rte-dropdown-menu:hover, .e-richtexteditor .e-rte-toolbar .e-toolbar-item .e-tbar-btn:hover .e-icons, .e-richtexteditor .e-rte-toolbar .e-toolbar-item .e-tbar-btn:focus .e-icons, .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-item .e-tbar-btn:hover .e-icons, .e-rte-quick-popup .e-rte-quick-toolbar .e-toolbar-item .e-tbar-btn:focus .e-icons, .e-richtexteditor .e-toolbar .e-toolbar-item .e-tbar-btn:hover .e-tbar-btn-text, .e-richtexteditor .e-toolbar .e-toolbar-item .e-tbar-btn:hover .e-icons, .e-richtexteditor .e-toolbar .e-toolbar-item .e-tbar-btn:hover:active .e-icons, .e-richtexteditor .e-toolbar .e-toolbar-item .e-tbar-btn:hover:active .e-tbar-btn-text {
            color: var(--bs-gray-800) !important;
        }
    /*----Syncfusion Upload Dropzone Customizations----*/
    .e-upload.e-control-wrapper {
        border-radius: var(--bs-border-radius);
        font-family: var(--bs-font-sans-serif);
        background: var(--bs-body-bg);
        border: 0;
    }

    .e-upload .e-file-drop {
        color: var(--bs-gray-700)
    }

    .e-upload-processing .e-upload.e-control-wrapper {
        background: var(--bs-success-light);
    }

    .e-upload-processing .e-file-select-wrap {
        display: none;
    }

    .e-upload .e-upload-files, .e-upload .e-upload-files .e-upload-file-list, .e-upload .e-upload-files {
        border: 0;
    }

        .e-upload .e-upload-files .e-file-remove-btn.e-icons, .e-upload .e-upload-files .e-file-delete-btn.e-icons, .e-upload .e-upload-files .e-file-reload-btn.e-icons, .e-upload .e-upload-files .e-file-abort-btn.e-icons, .e-upload .e-upload-files .e-file-pause-btn.e-icons, .e-upload .e-upload-files .e-file-play-btn.e-icons {
            color: var(--bs-gray-700) !important;
            font-weight: 600;
            font-size: 11px;
            margin-right: 2px;
            margin-left: 0;
            margin-bottom: 0;
            margin-top: 9px;
        }

        .e-upload .e-upload-files .e-file-pause-btn.e-icons, .e-upload .e-upload-files .e-file-play-btn.e-icons, .e-upload .e-upload-files .e-file-reload-btn.e-icons {
            right: 20px;
        }

        .e-upload .e-upload-files .e-file-remove-btn.e-icons, .e-upload .e-upload-files .e-file-delete-btn.e-icons, .e-upload .e-upload-files .e-file-abort-btn.e-icons {
            right: 4px;
        }

        .e-upload .e-upload-files .e-upload-file-list .e-file-container {
            margin-right: 20px;
        }

            .e-upload .e-upload-files .e-upload-file-list .e-file-container .e-progress-inner-wrap {
                background: var(--bs-gray-200) !important;
            }

            .e-upload .e-upload-files .e-upload-file-list .e-file-container .e-upload-progress-wrap .e-progress-inner-wrap {
                height: 8px;
            }

            .e-upload .e-upload-files .e-upload-file-list .e-file-container .e-progress-inner-wrap .e-upload-progress-bar.e-upload-progress {
                height: 8px;
                background: var(--bs-sky);
            }

    .e-upload-processing .e-upload .e-upload-files .e-upload-file-list .e-file-container .e-progress-inner-wrap .e-upload-progress-bar.e-upload-progress {
        background: var(--bs-success-600);
    }

    .e-upload .e-upload-files .e-upload-file-list .e-file-container .e-upload-progress-wrap {
        padding-top: 0px;
    }

    .e-upload .e-upload-files .e-upload-file-list .e-file-container .e-progress-bar-text, .e-upload .e-upload-files .e-upload-file-list .e-file-container .e-file-size {
        color: var(--bs-gray-600);
        font-weight: 500;
    }
    /*---Syncfusion Skeleton Colors---*/
    .e-skeleton.e-shimmer-wave::after {
        background-image: linear-gradient(90deg, transparent calc(50% - 100px), var(--bs-gray-300) 50%, transparent calc(50% + 100px));
    }

    .e-skeleton.e-skeleton-text, .e-skeleton.e-skeleton-square, .e-skeleton.e-skeleton-rectangle, .e-skeleton.e-skeleton-circle {
        background-color: var(--bs-gray-200);
    }
    /*---modalBlock.razor Customizations----*/
    .modalBlock .e-dialog {
        border: none;
    }

        .modalBlock .e-dialog .e-dlg-content {
            padding: 0;
        }
    /*---modalShareLink.razor Customizations---*/
    .modalShareLink .fade-overlay::before {
        background: -webkit-linear-gradient(270deg, rgba(0, 0, 0, 0.1) 0%, rgba(0, 0, 0, 0.8) 100%) !important;
    }

    .modalShareLink .e-dlg-header-content {
        padding: 0 !important;
        background-color: transparent;
        border: none !important;
        height: 125px;
    }

    .modalShareLink .e-dialog {
        background-color: transparent;
    }

        .modalShareLink.e-dialog:not(.settings-modal-unflush) .e-dlg-header-content + .e-dlg-content {
            padding: 0 2.25rem 2.25rem 2.25rem !important;
            padding-top: 0 !important;
            overflow: visible;
            background-color: var(--bs-body-bg);
            border: none !important;
            color: var(--bs-body-color);
            border-radius: 0;
        }

        .modalShareLink.e-dialog .e-dlg-header {
            height: 100%;
        }

    .modalShareLink .hidden-scroll {
        overflow-x: auto;
        overflow-y: hidden;
        -ms-overflow-style: none;
        scrollbar-width: none;
        max-width: 100%;
        white-space: nowrap;
    }

        .modalShareLink .hidden-scroll::-webkit-scrollbar {
            display: none !important;
        }
    /*---Syncfusion Multiselect Customizations---*/
    .e-ddl.e-multi-select-list-wrapper {
        background: var(--bs-menu-dropdown-bg-color) !important;
        margin-top: 1rem;
        box-shadow: var( --bs-menu-dropdown-box-shadow) !important;
        font-family: var(--bs-body-font-family) !important;
        overflow: hidden;
        border: unset;
        padding: 0.75rem !important;
        border-radius: 0.5rem;
    }

    .e-dropdownbase .e-list-item.e-hover, .e-dropdownbase .e-list-item.e-item-focus, .e-dropdownbase .e-list-item:hover {
        background-color: var(--bs-menu-link-bg-color-hover) !important;
        color: var(--bs-menu-link-color-hover);
    }

    .e-dropdownbase .e-list-item {
        font-family: Inter, "Noto Color Emoji", Helvetica, "sans-serif" !important;
        border-radius: 0.5rem;
        padding: 0.25rem 0;
        margin: 2px auto;
    }

    .e-ddl.e-multi-select-list-wrapper * {
        font-family: Inter, "Noto Color Emoji", Helvetica, "sans-serif" !important;
        font-weight: 500;
        background: var(--bs-menu-dropdown-bg-color);
        color: var(--bs-body-color);
    }

    .e-control, .e-css, .e-error {
        font-family: var(--bs-body-font-family) !important;
    }

    .form-control.form-control-custom .e-dropdownbase.e-control.e-multiselect {
        background-color: transparent !important;
        border: none !important
    }

    .form-control.form-control-custom .e-multi-select-list-wrapper {
        box-shadow: var(--bs-box-shadow) !important;
        border-radius: var(--bs-border-radius) !important;
        overflow: hidden !important;
        margin-top: 9px !important;
    }

        .form-control.form-control-custom .e-multi-select-list-wrapper .e-list-item {
            font-family: var(--bs-body-font) !important;
        }

    .form-control.form-control-custom .e-multi-select-wrapper input[type=text] {
        font-size: 12px;
        min-height: 22px;
        padding: 0 !important;
        margin: 3px;
    }

    .form-control.form-control-custom .e-multi-select-wrapper:not(.e-disabled) .e-chips {
        --bs-badge-padding-x: 0.5rem;
        --bs-badge-padding-y: 0.325rem;
        --bs-badge-font-size: 0.85rem;
        --bs-badge-color: var(--bs-body-color);
        --bs-badge-border-radius: 0.425rem;
        --bs-badge-font-weight: 600;
        font-weight: var(--bs-badge-font-weight);
        padding: var(--bs-badge-padding-y) var(--bs-badge-padding-x);
        white-space: nowrap;
        border-radius: var(--bs-badge-border-radius);
        height: 22px;
        background-color: var(--bs-secondary);
        color: var(--bs-secondary-inverse);
    }

    .form-control.form-control-custom .e-multiselect:not(.e-disabled) .e-multi-select-wrapper .e-chips:hover,
    .form-control.form-control-custom .e-multiselect:not(.e-disabled) .e-multi-select-wrapper .e-chips.e-chip-selected:hover {
        background-color: var(--bs-secondary-active);
        color: var(--bs-secondary-inverse);
    }

    .form-control.form-control-custom .e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon,
    .form-control.form-control-custom .e-multiselect.e-control-container.e-input-group .e-multi-select-wrapper .e-clear-icon {
        font-size: 12px;
        height: 22px;
        width: 24px;
    }

    .form-control.form-control-custom .e-multi-select-wrapper .e-chips-close {
        width: 12px;
        height: 12px;
        align-items: center;
    }

        .form-control.form-control-custom .e-multi-select-wrapper .e-chips-close:hover {
            opacity: 0.65;
        }

    .form-control.form-control-custom .e-multiselect:not(.e-disabled) .e-multi-select-wrapper .e-chips .e-chipcontent,
    .form-control.form-control-custom .e-multiselect:not(.e-disabled) .e-multi-select-wrapper .e-chips .e-chips-close::before {
        color: inherit !important;
        -webkit-text-fill-color: inherit !important;
    }

    .form-control.form-control-custom .e-multi-select-wrapper .e-chips > .e-chipcontent {
        font-family: var(--bs-body-font);
        font-size: 12px;
        padding: 0;
        padding-right: 0.75rem;
    }

    .form-control.form-control-custom .e-multiselect:not(.e-disabled) .e-multi-select-wrapper .e-chips .e-chips-close::before {
        font-size: 11px;
        line-height: 1;
        text-align: center;
    }

    .form-control.form-control-custom .e-multi-select-wrapper .e-searcher input[type=text],
    .form-control.form-control-custom .e-multi-select-wrapper .e-multi-searcher input[type=text] {
        color: var(--bs-gray-900);
        font-family: var(--bs-body-font-family) !important;
        font-weight: 400;
    }

    .form-control.form-control-custom .e-multi-select-wrapper {
        padding-right: 20px !important;
        min-height: 22px;
    }

    .form-control.form-control-custom .e-multiselect.e-control-container .e-multi-select-wrapper .e-multi-searcher,
    .form-control.form-control-custom .e-multiselect.e-control-container.e-input-group .e-multi-select-wrapper .e-multi-searcher {
        min-height: 22px;
    }

    .form-control.form-control-custom .e-multiselect.e-control-container .e-multi-select-wrapper .e-clear-icon,
    .form-control.form-control-custom .e-multiselect.e-control-container .e-multi-select-wrapper .e-ddl-icon, .form-control.form-control-custom .e-multiselect.e-control-container.e-input-group .e-multi-select-wrapper .e-clear-icon, .form-control.form-control-custom .e-multiselect.e-control-container.e-input-group .e-multi-select-wrapper .e-ddl-icon {
        right: -5px;
        top: calc(50% - 11px);
        margin-top: unset !important;
    }
    /*---Fix Tooltips on Syncfusion Modals---*/
    .e-dialog + .tooltip, .e-dialog ~ .tooltip, .e-dlg-container + .tooltip, .e-dlg-container ~ .tooltip, .e-dialog + .tooltip, .e-dialog ~ .popover, .e-dlg-container + .popover, .e-dlg-container ~ .popover {
        z-index: 90000000080;
    }
    /*Customized Syncfusion Datepicker*/


    .form-floating span.sfDatePicker {
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        border: none !important;
    }

    .form-floating .form-control.form-control-custom span.sfDatePicker input {
        padding: 0 1rem !important;
        height: calc(3.75rem + 2.8px) !important;
        min-height: calc(3.75rem + 2.8px) !important;
        line-height: 1 !important;
        padding-top: 1.85rem !important;
        padding-bottom: 0.625rem !important;
        box-shadow: none !important;
    }

    .form-control.form-control-custom span.sfDatePicker .e-input-group-icon.e-icons.e-date-icon {
        margin-right: -0.5rem;
    }

    .form-control.form-control-custom span.sfDatePicker .e-input-group-icon.e-icons {
        border: unset;
        scale: 0.75;
        border-radius: 0.5rem;
        font-size: 1.5rem;
    }

    .form-control-custom.sfDatePickerWrapper:focus:not(.border-0):not(:disabled):has(.invalid), .form-control-custom.sfDatePickerWrapper:focus-within:not(.border-0):not(:disabled):has(.invalid) {
        border-color: var(--bs-form-invalid-border-color) !important;
        box-shadow: 0 0 0 0.25rem var(--bs-danger-clarity) !important;
    }

    .form-control-custom.sfDatePickerWrapper:not(.border-0):not(:disabled):has(.invalid) {
        border-color: var(--bs-form-invalid-border-color) !important;
    }

    .form-control.form-control-custom:focus:not(.shadow-none):not(:disabled).sfDatePickerWrapper .e-input-group.e-control-wrapper.e-input-focus:not(.e-success):not(.e-warning):not(.e-error):not(.e-multiselect),
    .form-control.form-control-custom:focus:not(.shadow-none):not(:disabled).sfDatePickerWrapper .e-input-group.e-input-focus:not(.e-success):not(.e-warning):not(.e-error):not(.e-multiselect) {
        box-shadow: none !important;
    }

    .form-control.form-control-custom .e-control-container {
        box-shadow: none !important;
        font-family: var(--bs-body-font-family) !important;
        border-radius: 0.475rem !important;
        overflow: hidden;
        padding: 0px;
    }

    .form-control.form-control-custom .e-input-group:not(.e-success):not(.e-warning):not(.e-error), .form-control.form-control-custom .e-input-group.e-control-wrapper:not(.e-success):not(.e-warning):not(.e-error) {
        border-color: transparent;
    }

    .form-control.form-control-custom .e-input-group {
        background-color: transparent;
    }

        .form-control.form-control-custom .e-input-group.e-control-wrapper.e-input-focus {
            box-shadow: unset !important;
        }

        .form-control.form-control-custom .e-input-group .e-input-group-icon, .form-control.form-control-custom .e-input-group.e-control-wrapper .e-input-group-icon {
            background-color: var(--bs-gray-100);
            padding: 0.75rem;
            border-color: var(--bs-gray-300);
            color: var(--bs-gray-700);
        }

        .form-control.form-control-custom .e-input-group:not(.e-disabled) .e-input-group-icon:hover, .form-control.form-control-custom .e-input-group.e-control-wrapper:not(.e-disabled) .e-input-group-icon:hover {
            color: var(--bs-primary);
            background-color: var(--bs-primary-light);
        }

    .form-control.form-control-custom .e-date-wrapper span.e-input-group-icon.e-date-icon.e-icons.e-active {
        color: var(--bs-primary-inverse);
        background-color: var(--bs-primary);
    }

    .form-control.form-control-custom .e-control-container input.e-input {
        height: unset !important;
        padding: 1rem;
    }

    .form-control.form-control-custom .e-input-group.e-input-focus {
        background: transparent;
    }

    .hideSelectDropDown .e-ddl.e-multi-select-list-wrapper.e-popup {
        display: none !important;
    }

    .e-toast-container .e-toast {
        border: none;
    }

    .e-toast-content {
        color: #fff !important;
        text-align: center;
    }
    /*Syncfusion Popover for selecting emojis*/
    .sf-custom-popover .e-tooltip-wrap.e-popup {
        border-radius: 7px !important;
    }

    .sf-custom-popover .e-arrow-tip {
        display: none !important;
    }

    .sf-custom-popover .e-tip-content {
        padding-top: 0.5rem;
        padding-bottom: 1rem;
    }

    .sf-custom-emoji-picker {
        font-family: Inter, "Noto Color Emoji", Helvetica, "sans-serif" !important;
    }

        .sf-custom-emoji-picker .e-tab .e-tab-header .e-toolbar-item:not(.e-active) .e-tab-wrap {
            border: 0px solid transparent !important;
            border-bottom: 2px solid transparent !important;
        }

        .sf-custom-emoji-picker .e-tab .e-tab-header .e-toolbar-item:not(.e-active) {
            border: 0px solid transparent !important;
            filter: grayscale(1);
            border-bottom: 2px solid transparent !important;
        }

            .sf-custom-emoji-picker .e-tab .e-tab-header .e-toolbar-item:not(.e-active):hover {
                border: 0px solid transparent !important;
                border-bottom: 2px solid var(--bs-gray-400) !important;
                filter: grayscale(0.5)
            }

        .sf-custom-emoji-picker .e-tab .e-tab-header .e-toolbar-item.e-active .e-tab-wrap {
            border: 0px solid transparent !important;
        }

        .sf-custom-emoji-picker .e-tab .e-tab-header .e-toolbar-item .e-tab-wrap {
            padding: 0 0.25rem;
        }

        .sf-custom-emoji-picker .e-tab .e-tab-header .e-toolbar-item {
            margin-right: 0.5rem;
        }

            .sf-custom-emoji-picker .e-tab .e-tab-header .e-toolbar-item.e-active {
                border: 0px solid transparent !important;
                border-bottom: 2px solid var(--bs-primary) !important;
                background: transparent !important;
            }

        .sf-custom-emoji-picker .e-tab-text {
            font-family: "Noto Color Emoji" !important;
        }

        .sf-custom-emoji-picker .e-content.e-lib.e-touch {
            max-height: 250px;
            overflow: auto;
        }

        .sf-custom-emoji-picker .e-toolbar-items {
            padding-left: 1rem;
            padding-right: 1rem;
        }

        .sf-custom-emoji-picker .e-tab .e-tab-header:not(.e-vertical)::before {
            border: none !important;
        }

    .e-tooltip-wrap.sf-custom-popover .e-tip-content {
        z-index: 2;
    }

    .e-tooltip-wrap.sf-custom-popover .e-tooltip-close {
        width: 100%;
        height: 100%;
        position: fixed;
        z-index: 1;
        left: 0;
        top: 0;
        border-radius: 0;
        opacity: 0;
        cursor: default;
    }

    .sf-custom-popover.e-tooltip-wrap.e-popup {
        background: var(--bs-body-bg);
        box-shadow: var(--bs-box-shadow-lg);
        border-radius: var(--bs-border-radius);
        border: 1px solid var(--bs-secondary);
    }

    .sf-custom-emoji-picker .e-control.e-toolbar.e-lib.e-tab-header.e-keyboard {
        margin-bottom: 0.5rem;
        background: var(--bs-body-bg);
        border-bottom: 1px solid var(--bs-secondary);
    }
    /* Emoticons */
    .rteEmoticons {
        padding: 0 0 10px 10px;
    }
    /*char_block*/
    .char_block {
        width: 30px;
        height: 30px;
        line-height: 30px;
        margin: 0 0.25rem 0.25rem 0;
        text-align: center;
        vertical-align: middle;
        font-size: 20px;
        cursor: pointer;
        user-select: none;
        display: inline-block;
        border-radius: var(--bs-border-radius-sm);
    }

        .char_block:hover, .char_block:active, .char_block:focus {
            background-color: var(--bs-secondary)
        }

        .char_block.e-active {
            outline: 1px solid #e3165b;
            border-color: #e3165b;
        }

    .bootstrap4 .char_block.e-active {
        outline: 1px solid #007bff;
        border-color: #007bff;
    }

    .bootstrap .char_block.e-active, .bootstrap-dark .char_block.e-active {
        outline: 1px solid #317ab9;
        border-color: #317ab9;
    }
    /*----FORM INPUT AND SELECT2 CUSTOMIZATIONS-----*/



    .e-input-group {
        display: block;
        width: 100%;
        padding: 0.775rem 1rem;
        font-size: 1.1rem;
        font-weight: 500;
        line-height: 1.5;
        color: var(--bs-gray-700);
        appearance: none;
        background-color: var(--bs-body-bg);
        background-clip: padding-box;
        border: 1px solid var(--bs-gray-300);
        border-radius: 0.475rem !important;
    }

    .e-maskedtextbox.e-input {
        padding: 0 !important;
        color: var(--bs-gray-700) !important;
        font-weight: 500 !important;
        font-family: var(--bs-body-font);
        height: unset !important;
        line-height: 1.25;
        font-size: 1.1rem;
    }

    .form-control-plaintext .e-input {
        padding: 0 !important;
        color: var(--bs-gray-500) !important;
        font-weight: 400 !important;
        font-family: var(--bs-body-font);
        height: unset !important;
        line-height: 1.25;
        font-size: 1.1rem;
    }
    /*----SYNCFUSION CHART CUSTOMIZATION -----*/
    .e-control.e-chart rect {
        stroke: transparent !important;
        fill: transparent !important;
    }
    /*----SYNCFUSION SPINNER CUSTOMIZATION -----*/
    .e-spinner-pane .e-spinner-inner .e-spin-bootstrap5, .e-spinner-pane .e-spinner-inner .e-spin-bootstrap5v3 {
        stroke: var(--bs-primary);
        height: 2rem !important;
        width: 2rem !important;
        transform-origin: 1rem 1rem 1rem !important;
    }
    /*-----RTE & POST MEDIA----*/
    .e-rte-video, .e-rte-image, .e-rte-audio {
        outline-color: var(--bs-primary) !important;
        box-shadow: var(--bs-box-shadow-sm);
    }

    .e-rte-image, .e-rte-video {
        border-radius: 1rem;
        padding: 0 !important;
    }

    .e-vid-resize, .e-img-resize {
        display: none !important;
    }

    .e-rte-image {
        width: auto !important;
        height: auto !important;
        max-height: 300px !important;
        max-width: 100% !important;
        margin: unset !important;
        display: block !important;
    }

    .e-img-inner {
        opacity: 0.5 !important;
        margin-bottom: 1rem !important;
        font-size: 14px !important;
        font-weight: normal;
        font-style: italic;
        text-align: left !important;
        padding: 0.5rem 1rem;
    }

    .e-video-inline, .e-video-break {
        width: 100% !important;
        max-width: 100% !important;
        overflow: hidden;
        display: block;
    }

    .e-embed-video-wrap, .e-video-wrap {
        position: relative;
        max-width: 100% !important;
        width: 450px;
        overflow: hidden;
        display: block !important;
        --bs-aspect-ratio: 56.25%;
        border-radius: 1rem;
    }

    .message-text {
        position: relative;
        width: 100%;
    }

    .e-embed-video-wrap::before, .e-video-wrap::before {
        display: block;
        padding-top: var(--bs-aspect-ratio);
        content: "";
    }

    .e-video-clickelem, .e-video-embed-wrap > *, .e-video-wrap > * {
        display: block !important;
        width: 100% !important;
        height: 100% !important;
        position: absolute !important;
        top: 0;
        left: 0;
        max-height: unset !important;
        margin: unset !important;
    }

        .e-video-clickelem iframe {
            height: 100% !important;
            width: 100% !important;
            position: relative;
            border-radius: 1rem;
        }

    span.e-audio-wrap, .e-richtexteditor .e-audio-wrap {
        max-width: calc(100% - 2rem) !important;
        width: 600px !important;
        margin-left: auto !important;
        margin-right: auto !important;
        display: block;
        background-color: var(--bs-body-bg);
        border-radius: 50px;
        padding: 0.25rem;
    }

    .e-clickelem, .e-rte-audio {
        width: 100%;
        margin-left: auto !important;
        margin-right: auto !important;
        display: block !important;
        border-radius: inherit;
    }

    .e-rte-image, .e-rte-image.e-imgbreak {
        cursor: inherit;
    }

    a .e-rte-image, .e-richtexteditor .e-rte-image {
        cursor: pointer;
    }
    /*---DARK MODE MODIFICATIONS---*/


    [data-bs-theme="dark"] .e-hscroll.e-scroll-device .e-scroll-nav.e-scroll-right-nav {
        background-color: var(--bs-gray-300) !important;
        border-color: var(--bs-gray-300) !important;
    }

    .e-hscroll .e-scroll-overlay.e-scroll-left-overlay {
        background-image: linear-gradient(-270deg, var(--bs-gray-300) 0%, rgba(233, 236, 239, 0) 100%)
    }

    .e-hscroll .e-scroll-overlay.e-scroll-right-overlay {
        background-image: linear-gradient(-270deg, rgba(233, 236, 239, 0) 0%, var(--bs-gray-300) 100%)
    }



    [data-bs-theme=dark] .card .menu {
        --bs-menu-link-bg-color-hover: var(--bs-aside-bg-color);
        --bs-menu-link-bg-color-show: var(--bs-aside-bg-color);
        --bs-menu-link-bg-color-here: var(--bs-aside-bg-color);
        --bs-menu-link-bg-color-active: var(--bs-aside-bg-color);
    }

    [data-bs-theme=dark] .card .table-hover {
        --bs-table-hover-bg: var(--bs-body-bg)
    }

    [data-bs-theme=dark] {
        --bs-symbol-label-bg: rgba(255, 255, 255, 0.05);
    }

        [data-bs-theme=dark] .btn.btn-outline:not(:hover):not(.active):not(:active):not(:focus):not(.disabled) {
            background-color: var(--bs-aside-bg-color) !important;
        }

        [data-bs-theme=dark] .badge-outline {
            background-color: transparent !important;
        }

        [data-bs-theme=dark] .ki-duotone, [data-bs-theme=dark] .ki-outline, [data-bs-theme=dark] .ki-solid, [data-bs-theme=dark] .e-richtexteditor .e-rte-placeholder {
            color: var(--bs-secondary-color);
        }

        [data-bs-theme=dark] .checkbox-group:not(.disabled) .symbol-label, [data-bs-theme=dark] .checkbox-group.active {
            background: var(--bs-primary-clarity);
        }

            [data-bs-theme=dark] .checkbox-group.active .checkbox-group-title, [data-bs-theme=dark] .checkbox-group.active span:not(.checkbox-group-title):not(.badge) {
                color: var(--bs-primary-700) !important;
            }

        [data-bs-theme=dark] .e-richtexteditor .e-rte-placeholder {
            color: var(--bs-gray-600);
        }

        [data-bs-theme=dark] .bg-hover-light:hover, [data-bs-theme=dark] .bg-active-light.active {
            background: var(--bs-secondary-clarity) !important;
        }

    .e-grid .e-table {
        background: var(--bs-card-bg)
    }

    .e-grid.e-gridhover .e-frozenhover:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell), .e-grid.e-gridhover .e-row tr:not(.e-disable-gridhover):not(.e-editedrow):not(.e-detailrow):hover .e-rowcell:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell), .e-grid.e-gridhover:not(.e-rowdrag) .e-row:not(.e-disable-gridhover):not(.e-editedrow):not(.e-detailrow):hover .e-rowcell:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell), .e-grid.e-gridhover .e-row:not(.e-disable-gridhover):not(.e-detailrow):hover .e-detailrowcollapse:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell), .e-grid.e-gridhover:not(.e-rowdrag) .e-row:not(.e-disable-gridhover):not(.e-detailrow):hover .e-rowdragdrop:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell), .e-grid.e-rtl .e-gridhover .e-row:not(.e-disable-gridhover):not(.e-detailrow):hover .e-rowdragdrop:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell), .e-grid.e-gridhover .e-row.e-addedrow:not(.e-disable-gridhover):not(.e-detailrow):hover .e-dragindentcell:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell), .e-grid.e-gridhover .e-row:not(.e-disable-gridhover):not(.e-detailrow):hover .e-detailrowexpand:not(.e-cellselectionbackground):not(.e-active):not(.e-updatedtd):not(.e-indentcell) {
        background: var(--bs-secondary-clarity) !important;
        color: var(--bs-body-color);
    }

    .e-grid .e-rowcell:not(.e-editedbatchcell):not(.e-updatedtd), .e-grid .e-detailrowcollapse:not(.e-editedbatchcell):not(.e-updatedtd), .e-grid .e-detailrowexpand:not(.e-editedbatchcell):not(.e-updatedtd), .e-grid .e-gridcontent .e-rowdragdrop:not(.e-editedbatchcell):not(.e-updatedtd), .e-grid .e-gridheader .e-rowdragdrop:not(.e-editedbatchcell):not(.e-updatedtd), .e-grid .e-emptyrow:not(.e-editedbatchcell):not(.e-updatedtd) {
        color: var(--bs-text-gray-800);
    }

    .e-grid .e-headercell, .e-grid .e-detailheadercell {
        background: var(--bs-gray-50)
    }

    [data-bs-theme=dark] .btn.btn-outline.btn-outline-primary, [data-bs-theme=dark] .btn-check:checked + .btn.btn-outline.btn-outline-primary, [data-bs-theme=dark] .btn-check:active + .btn.btn-outline.btn-outline-primary, [data-bs-theme=dark] .btn.btn-outline.btn-outline-primary:focus:not(.btn-active), [data-bs-theme=dark] .btn.btn-outline.btn-outline-primary:hover:not(.btn-active), [data-bs-theme=dark] .btn.btn-outline.btn-outline-primary:active:not(.btn-active), [data-bs-theme=dark] .btn.btn-outline.btn-outline-primary.active, [data-bs-theme=dark] .btn.btn-outline.btn-outline-primary.show, [data-bs-theme=dark] .show > .btn.btn-outline.btn-outline-primary {
        --bs-primary-100: var(--bs-primary);
        --bs-primary-200: var(--bs-primary-active);
    }

    [class*=-gradient] {
        background-blend-mode: var(--bs-gradient-blend-mode);
    }

    [class*=primary-gradient], [class*=onyx-gradient] {
        background-blend-mode: unset !important;
    }

    .e-upload .e-upload-files .e-upload-file-list .e-file-container .e-file-name, .e-upload .e-upload-files .e-upload-file-list .e-file-container .e-file-type, .e-upload .e-upload-files .e-upload-file-list .e-file-container .e-file-status, .e-upload .e-upload-files .e-upload-file-list .e-file-container .e-file-information {
        color: var(--bs-body-color);
    }
    /*---Syncfusion Image Editor Customizations---*/
    .e-dialog.modalCropper .e-ie-toolbar-undo, .e-dialog.modalCropper .e-ie-toolbar-redo, .e-dialog.modalCropper .e-ie-toolbar-check-btn, .e-dialog.modalCropper .e-ie-toolbar-close-btn, .e-dialog.modalCropper .e-image-editor .e-contextual-toolbar-wrapper, .e-dialog.modalCropper .e-image-editor .e-bottom-toolbar-area, .e-dialog.modalCropper .e-image-editor .e-ie-drop-area {
        display: none !important;
    }

    .e-dialog.modalCropper {
        --cropper-width: 370px;
        --cropper-ratio: 1;
    }

    @media (max-width: 420px) {
        .e-dialog.modalCropper {
            --cropper-width: calc(100dvw - 60px) !important;
        }
    }

    .e-dialog.modalCropper {
        max-height: 90vh !important;
    }

        .e-dialog.modalCropper:not(.settings-modal-unflush) .e-dlg-content {
            padding-top: 0px !important;
        }

        .e-dialog.modalCropper .e-toolbar {
            border-bottom: 1px solid var(--bs-gray-300);
            width: 100%;
        }

    [data-bs-theme="light"] .e-dialog.modalCropper .e-toolbar {
        background: #0d101c;
    }

    [data-bs-theme="dark"] .e-dialog.modalCropper .e-toolbar {
        background: #0f1013;
    }

    [data-bs-theme="light"] .cropper-wrapper {
        background: #0d101c;
    }

    [data-bs-theme="dark"] .cropper-wrapper {
        background: #0f1013;
    }

    .cropper-wrapper {
        overflow: hidden;
        border-radius: 1rem;
    }

    .e-dialog.modalCropper .e-toolbar .e-btn.e-icon-btn, .e-dialog.modalCropper .e-toolbar .e-toolbar-item {
        padding: 0 !important;
    }

    .e-dialog.modalCropper .e-toolbar-left {
        padding-left: 4px
    }

    .e-dialog.modalCropper .e-image-editor {
        background: var(--bs-dark);
        border: 1.4px solid transparent;
    }

        .e-dialog.modalCropper .e-image-editor.e-control {
            width: 100% !important;
            z-index: 2;
            opacity: 0;
            transition: opacity 0.5s ease;
            /*height: calc(var(--cropper-width) * var(--cropper-ratio)) !important;
    */
        }

    .cropper-skeleton {
        position: absolute;
        top: 0;
        left: 0;
        z-index: 1;
        opacity: 1;
    }

        .cropper-skeleton.e-skeleton.e-shimmer-wave::after {
            background-image: linear-gradient(90deg, transparent calc(50% - 100px), #2e345161 50%, transparent calc(50% + 100px));
        }
    /*---------------------END | SYNCFUSION---------------------*/
    /*---------------------START | CLICKBANK PAYMENT PROCESSING---------------------*/

    iframe#tx_iframe_ccnumber {
        height: 18px;
    }

    #ccnumber.form-is-focused {
        border-color: var(--bs-primary-300) !important;
        box-shadow: 0px 0px 0px 4px var(--bs-primary-clarity) !important;
    }
    /*---------------------END | CLICKBANK PAYMENT PROCESSING---------------------*/
