
.nixie__wrapper {
    padding: 4px 6px;
    position: relative;
    background: #000;
    overflow: hidden;
    width: 218px;
}

.nixie__value {
    font-family: 'Nixie One', cursive;

    font-size: 18px;

    /*    text-align: center; */
    text-shadow: 0 0 5px #FCFA36, 0 0 7px #FC9836, 0 0 20px #FF3C3C, 0 0 25px #FF3C3C;
    color: #FEDB01;

    white-space: nowrap;

}

.nixie__mesh {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAGCAYAAAD68A/GAAAAMklEQVQIW2NkQAJmDAxnYNxTDAwmyHKMMA5IEbIkOh+sEF0Qm2ZGXIqQFYPYxJtIrBsBdYoVCa7CTHkAAAAASUVORK5CYII=) repeat;
}


.studio_door {
    position: relative;
    background: url('../img/studio-door.svg');
    background-position-x: center;
    background-position-y: top;
    background-repeat: no-repeat;
    background-attachment: scroll;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}



.studio_door_sign_position {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.studio_door_sign {
    min-width: 150px;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 300px;
    word-break: break-word;
}



.ss_tab_btn {
    border-bottom: 1px !important;
    background-color: var(--bs-tertiary-bg);
    color: var(--bs-secondary-text-emphasis);
}

    .ss_tab_btn:hover {
        background-color: var(--bs-secondary-bg) !important;
        color: var(--bs-body-color);
    }


    .ss_tab_btn.active {
        border-bottom: 1px transparent !important;
        background-color: var(--bs-secondary-bg) !important;
    }



.studio_tack_board {
    max-width: 450px;
}


.tackboard_post {
    background-color: var(--bs-secondary-bg) !important;
}



.bold_on_hover:hover {
    font-weight: 500;
}


.studio_door_bottom_spacer {
    height: 60px;
}

/*
    This makes the lock wrapper footer the same height as the other footers
    But it looks weird, because it's too big
    Slight downside, the lock wrapper will be further down than ActionButtons or the DoorLinkWrapper

.studio_door_lock_wrapper {
    position: absolute;
    bottom: 0;
    height: 49.5px;
}


@media (min-width: 768px) {

    .studio_door_lock_wrapper {
        height: 56px;
    }
}*/



.studio_door_lock_wrapper {
    position: absolute;
    bottom: 0;
}

.studio_door_link_button_wrapper {
    position: absolute;
    bottom: 0;
}

.studio_door_action_buttons {
    position: absolute;
    bottom: 0;
}







.studio_door_neon_status_sign {
    height: 23px;
}



.doors_open_close_tooltip {
    --bs-tooltip-bg: var(--bs-secondary-bg-subtle);
    --bs-tooltip-color: var(--bs-secondary-text-emphasis);
}


.studio_door_schedule_table {
    margin-top: -6px;
}




#studio_door_panel,
.soundboard_panel,
#session_chat_panel,
#studio_waveform_panel,
#loading_placeholder {
    position: absolute !important;
}

    #studio_door_panel .card-header,
    .soundboard_panel .card-header,
    #session_chat_panel .card-header,
    #studio_waveform_panel .card-header {
        cursor: move;
    }







/*
.h_line {
    z-index: 100;
    height: 1px;
    width: 80%;
    position: absolute;
    top: 500px;
}


#h_line_1 {
    background-color: lawngreen;
}

#h_line_2 {
    background-color: red;
}
*/




#studio_session_chat_entries {
    list-style-type: none;
    padding: 0;
    margin: 0;
}



#studio_session_chat_entries li {
    margin-bottom: .5em;
}



.tt-chat_timestamp {
    --bs-tooltip-opacity: 1;
    --bs-tooltip-bg: var(--bs-primary-bg-subtle);
    --bs-tooltip-color: var(--bs-primary-text-emphasis);
    --bs-tooltip-arrow-width: 20px;
    --bs-tooltip-arrow-height: 10px;
}

.tt-chat_info {
    --bs-tooltip-opacity: 1;
    --bs-tooltip-bg: var(--bs-info-bg-subtle);
    --bs-tooltip-color: var(--bs-info-text-emphasis);
    --bs-tooltip-arrow-width: 20px;
    --bs-tooltip-arrow-height: 10px;
}

.chat_panel_header_control_buttons {
    flex-shrink: 0;
}


#view_session_chat_filters_dropdown,
#chat_table_column_selection_dropdown,
#view_session_chat_table_filters_button {
    -webkit-transition: -webkit-transform 0.5s, max-width 0.5s;
    -moz-transition: -moz-transform 0.5s, max-width 0.5s;
    -o-transition: -o-transform 0.5s, max-width 0.5s;
    transition: transform 0.5s, max-width 0.5s;
}


    #view_session_chat_table_filters_button.input_group_first_element {
        margin-left: 3px;
    }


    #session_chat_search_input {
        -webkit-transition: -webkit-transform 0.5s, max-width 0.5s, padding-left 0.5s;
        -moz-transition: -moz-transform 0.5s, max-width 0.5s, padding-left 0.5s;
        -o-transition: -o-transform 0.5s, max-width 0.5s, padding-left 0.5s;
        transition: transform 0.5s, max-width 0.5s, padding-left 0.5s;
        max-width: 250px;
        padding-left: 6px;
        border-left: none;
    }


.hide #session_chat_search_input {
    max-width: 0px !important;
    border-right: none;
    padding-right: 0px;
    padding-left: 0px;
    margin: 0;
}


    #view_session_chat_filters_dropdown.hide,
    #chat_table_column_selection_dropdown.hide,
    #view_session_chat_table_filters_button.hide {
        transform: scaleX(0);
        max-width: 0px !important;
        border-right: none;
        padding: 0 !important;
        margin: 0 !important;
    }

    .column_filter_dropdown_wrapper {
        transition: max-width 0.5s;
        max-width: 35px;
    }

        .column_filter_dropdown_wrapper.hide {
            max-width: 0px;
        }

    #view_session_chat_filters_dropdown button,
    #chat_table_column_selection_dropdown button {
        border-top-left-radius: 0 !important;
        border-bottom-left-radius: 0 !important;
    }

    #chat_table_column_selection_dropdown button {
        border-top-right-radius: 0 !important;
        border-bottom-right-radius: 0 !important;
    }


    /*

#session_chat_show_hide_column_menu {
    overflow-y: scroll;
    max-height: 200px;
}


*/

    .panel_body {
        overflow: hidden;
    }


    .chat_panel_body {
        white-space: nowrap;
        position: relative;
        overflow-y: auto;
        overflow-x: hidden;
    }

    .chat_entry_wrapper {
        position: absolute;
        display: inline-block;
    }


    .chat_table_wrapper {
        transform: translateX(115%);
        overflow: hidden;
        height: 100%;
    }


        .chat_table_wrapper .bootstrap-table {
            height: 100%;
        }

            .chat_table_wrapper .bootstrap-table .fixed-table-container {
                height: 100%;
            }

    .chat_panel_body.show_table {
        overflow-x: hidden;
    }

    .chat_entry_wrapper,
    .chat_table_wrapper {
        -webkit-transition: -webkit-transform 0.5s ease-in-out;
        -moz-transition: -moz-transform 0.5s ease-in-out;
        -o-transition: -o-transform 0.5s ease-in-out;
        transition: transform 0.5s ease-in-out;
    }



    .chat_panel_body.show_table .chat_entry_wrapper {
        height: 0px;
        width: 0px;
        transform: scaleX(0);
    }

    .chat_panel_body.show_table .chat_table_wrapper {
        transform: translateX(0);
    }


    .chat_panel_body.show_entries .chat_entry_wrapper {
        transform: scaleX(1);
    }


    .chat_panel_body.show_entries .chat_table_wrapper {
        transform: translateX(100%);
    }



    .chat_message {
        white-space: pre-line;
    }

    .chat_panel_body.show_table .chat_message,
    .chat_panel_body.show_entries .chat_message {
        white-space: nowrap;
    }



    .popover-body {
        white-space: pre-wrap;
    }




    th[data-multi-filter] .th-inner {
        overflow: visible !important;
    }


    .filter_type_selector {
        background-color: var(--bs-body-bg);
    }

        .filter_type_selector option {
            background-color: var(--bs-body-bg);
        }



    .dropdown_toggle_button label {
        cursor: pointer;
    }

    .dropdown_toggle_button input {
        width: 20px;
        min-width: 20px;
        height: 20px;
    }





    .svg_icon {
        width: 16px;
        height: auto;
    }

        .svg_icon[src="/img/AddRemoveColumnsIcon.svg"] {
            transform: translateY(-2px);
        }

        .svg_icon[src="/img/ArrowDownToLine.svg"] {
            transform: translateY(-3px);
        }

        .svg_icon[src="/img/BadgeWithStar.svg"],
        .svg_icon[src="/img/BadgeWithR.svg"],
        .svg_icon[src="/img/BadgeWithoutStar.svg"] {
            transform: scale(.8) translate(-2px,-2px);
            margin: -6px -0px;
        }

/* White foreground - Regardless of theme */
.btn-secondary .svg_icon {
    filter: invert(100%) sepia(0%) saturate(7472%) hue-rotate(3deg) brightness(106%) contrast(108%);
}

[data-bs-theme=dark] .btn-outline-secondary .svg_icon,
[data-bs-theme=dark] .text-secondary .svg_icon {
    filter: invert(51%) sepia(7%) saturate(529%) hue-rotate(169deg) brightness(90%) contrast(87%);
}

    @media (prefers-color-scheme: dark) {
        [data-bs-theme=auto] .btn-outline-secondary .svg_icon,
        [data-bs-theme=auto] .text-secondary .svg_icon {
            filter: invert(51%) sepia(7%) saturate(529%) hue-rotate(169deg) brightness(90%) contrast(87%);
        }
    }

    [data-bs-theme=light] .btn-outline-secondary .svg_icon,
    [data-bs-theme=light] .text-secondary .svg_icon {
        filter: invert(47%) sepia(10%) saturate(402%) hue-rotate(167deg) brightness(93%) contrast(84%);
    }

    @media (prefers-color-scheme: light) {
        [data-bs-theme=auto] .btn-outline-secondary .svg_icon,
        [data-bs-theme=auto] .text-secondary .svg_icon {
            filter: invert(47%) sepia(10%) saturate(402%) hue-rotate(167deg) brightness(93%) contrast(84%);
        }
    }


[data-bs-theme=dark] .btn-outline-secondary:hover .svg_icon,
[data-bs-theme=dark] .btn-outline-secondary.show .svg_icon,
[data-bs-theme=dark] .text-secondary:hover .svg_icon {
    filter: invert(96%) sepia(100%) saturate(0%) hue-rotate(90deg) brightness(104%) contrast(105%);
}

    @media (prefers-color-scheme: dark) {
        [data-bs-theme=auto] .btn-outline-secondary:hover .svg_icon,
        [data-bs-theme=auto] .btn-outline-secondary.show .svg_icon,
        [data-bs-theme=auto] .text-secondary:hover .svg_icon {
            filter: invert(96%) sepia(100%) saturate(0%) hue-rotate(90deg) brightness(104%) contrast(105%);
        }
    }

[data-bs-theme=light] .btn-outline-secondary:hover .svg_icon,
[data-bs-theme=light] .btn-outline-secondary.show .svg_icon,
[data-bs-theme=light] .text-secondary:hover .svg_icon {
    filter: invert(96%) sepia(100%) saturate(0%) hue-rotate(90deg) brightness(104%) contrast(105%);
}

    @media (prefers-color-scheme: light) {
        [data-bs-theme=auto] .btn-outline-secondary:hover .svg_icon,
        [data-bs-theme=auto] .btn-outline-secondary.show .svg_icon,
        [data-bs-theme=auto] .text-secondary:hover .svg_icon {
            filter: invert(96%) sepia(100%) saturate(0%) hue-rotate(90deg) brightness(104%) contrast(105%);
        }
    }



    [data-bs-theme=dark] .dropdown-item .svg_icon {
        filter: invert(85%) sepia(27%) saturate(94%) hue-rotate(169deg) brightness(83%) contrast(84%);
    }

    @media (prefers-color-scheme: dark) {
        [data-bs-theme=auto] .dropdown-item .svg_icon {
            filter: invert(85%) sepia(27%) saturate(94%) hue-rotate(169deg) brightness(83%) contrast(84%);
        }
    }

    [data-bs-theme=light] .dropdown-item .svg_icon {
        filter: invert(12%) sepia(7%) saturate(978%) hue-rotate(169deg) brightness(94%) contrast(92%);
    }

    @media (prefers-color-scheme: light) {
        [data-bs-theme=auto] .dropdown-item .svg_icon {
            filter: invert(12%) sepia(7%) saturate(978%) hue-rotate(169deg) brightness(94%) contrast(92%);
        }
    }

    .sub_menu_right:hover > .dropdown-menu {
        display: block !important;
        left: 100%;
        top: 0;
    }


    .th-inner {
        padding: 0 !important;
    }

    .column_header_title {
        margin: 10px 6px 10px 6px;
        cursor: grab;
    }


.chat_panel_search_bar {
    width: unset;
    flex: 1 1 10rem;
    min-width: 10rem;
    max-width: -webkit-fit-content;
    max-width: -moz-fit-content;
    max-width: fit-content;
}

.chat_panel_search_bar.hide {
    flex: unset;
    min-width: unset;
}




.dragtable-sortable {
    z-index: 9999;
}

[data-bs-theme=dark] .dragtable-sortable li {
    background: #212529;
}

@media (prefers-color-scheme: dark) {
    [data-bs-theme=auto] .dragtable-sortable li {
        background: #212529;
    }
}


[data-bs-theme=dark] .ui-sortable-placeholder {
    box-shadow: 4px 5px 4px #0A0B0C inset !important;
    border-bottom: 1px solid #1A1B1C !important;
    border-top: 1px solid #1A1B1C !important;
    background: #1A1B1C !important;
}

@media (prefers-color-scheme: dark) {
    [data-bs-theme=auto] .ui-sortable-placeholder {
        box-shadow: 4px 5px 4px #0A0B0C inset !important;
        border-bottom: 1px solid #1A1B1C !important;
        border-top: 1px solid #1A1B1C !important;
        background: #1A1B1C !important;
    }
}
