:root {
    font-size: 11px;
    --header-height: 35px;
    --menu-bar-width: 180px;

}

html {
    background-color: #232c3d;
    height: 100%;
    width: 100%;
}

body {
    /*height: 100%; BODY SCROLL*/
    min-height: 100%;
    width: 100%;
    display: flex;
    flex-direction: column;
}

body > div {
    display: flex;
    flex-direction: column;
    flex: 1;
}

@media screen and (min-width: 768px) {
    body {
        height: 100%;
        overflow: hidden;
    }

    body > div, #main {
        max-height: 100%;
    }

    .widget {
        overflow: hidden;
    }
}

/* MAIN */
.main-header {
    background: #0b1619;
    border-bottom: 1px solid #263238;
    padding: 0;
    width: unset;
    position: fixed;
    left: 0;
    top: 0;
    margin: 0;
    min-height: var(--header-height);
    width: 100vw;
    z-index: 99;
    box-sizing: border-box;
}

.main-header > .flex-row::after {
    content: ' ';
    flex: 1;
}

.main-header #menu-bar {
    position: absolute;
    width: var(--menu-bar-width);
    height: var(--header-height);
    display: flex;
    align-items: center;
    justify-content: flex-end;
    top: 0;
    right: 0;
    margin: 0;
    z-index: 10000;
}

#menu-bar li {
    display: flex;
    justify-content: flex-end;
}

.flex-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

.breadcrumbs {
    display: flex;
    flex: 1;
}

.search.ui-autocomplete-input, .uni_dropdown > .dropbtn {
    font-size: 0.6em !important;
}

#main {
    margin: var(--header-height) 0px 0px;
}

.main_content {
    width: 100%;
}

.box_header {
    display: flex;
    align-items: center;
    text-shadow: none;
    text-align: left;
    text-transform: uppercase;
    letter-spacing: 0.2em;
    font-size: 0.9em;
    padding: 5px;
}

.widget_content {
    overflow: hidden;
}

@media screen and (min-width: 1300px) {
    /* MAIN */
    .main_content {
        min-width: 100%;
        box-sizing: border-box;
        height: 100%;
    }

    div.main.show {
        width: calc(100% - 180px);
    }
}

@media screen and (max-width: 768px) {
    .main-header {
        min-height: calc(var(--header-height) * 2);
    }

    /* MAIN */
    #main {
        margin: calc(var(--header-height) * 2) 0px 0px;
    }

    tr.events td:nth-child(3) {
        transform: translateY(0%);
    }

    .widget {
        display: flex;
        flex-direction: column;
        /* overflow: hidden; */
        max-height: 500px !important;
        padding-bottom: 50px !important;
    }

    .search_and_universe {
        flex-grow: 1;
        justify-content: space-between;
        margin: auto;
    }
}

/* DATATABLES */
@media screen and (max-width: 992px) {
    .dataTables_scroll {
    }
}


/* GRIDSTACK */
@media screen and (max-width: 992px) {
    .grid-stack .grid-stack-item .widget {
        padding-bottom: 0 !important;
    }

    .grid-stack-item {
        width: 100%;
    }

    .dataTables_processing {
        background: rgba(0, 0, 0, 1);
    }
}

/* STAMPS */
@media screen and (max-width: 992px) {
    .widget.activity_monitor.height100 {
        max-height: unset !important;
    }

    .am_custom_filter_button {
        margin-right: 35px;
        margin-left: auto;
    }
}

/* STOCKS */
.stock_stamp_view > .am_custom_filter_container {
    position: absolute;
    left: 0;
    top: 6px;
    right: 0;
    display: flex;
    text-align: center;
    justify-content: center;
}

/* CALENDAR WIDGET */
#cal_selector {
    flex: 2;
    margin: auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}

.calendar_navigator_right {
    text-align: right;
}

@media screen and (max-width: 992px) {
    .widget_content.calendar_view {
        height: unset;
        flex: 1;
    }

    .widget.calendar_view {
        height: unset !important;
        width: unset !important;
        max-height: unset !important;
        max-width: 100%;
    }

    #calendar_navigator {
        height: unset !important;
        /* width: unset !important; */
        padding: 5px 5px 0;
        align-items: center;
        /* margin: auto; */
    }

    #cal_selector {
        flex: 3;
        margin: unset;
        display: flex;
        flex-wrap: wrap;
        justify-content: unset;
        align-items: center;
    }

    .calendar_navigator_left, .calendar_navigator_right {
        margin: 0;
        padding: 0;
        flex: 1;
        height: unset;
    }

    .dropdown dt a {
        min-width: unset;
    }

    .day_container {
        flex: 1 0 300px;
        max-height: 50vh;
        margin-top: 50px;
    }

    .calendar_weekdays {
        display: flex;
        text-align: center;
    }

    .calendar_week_day {
        height: unset;
        overflow: unset;
    }

    .calendar_week_day.calendar_day_name {
        flex: 1;
        padding: 0;
        margin: 0;
        height: unset;
    }

    #month_ahead_div {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
    }
}

/* LIVE COMMODITIES */
@media screen and (max-width: 992px) {
    .grid-stack-one-column-mode .grid-stack-item[data-gs-height="6"] {
        min-height: 500px !important;
    }
}

/* LIVE COMMODITIES */
@media screen and (max-width: 992px) {
    .grid-stack-one-column-mode .grid-stack-item[data-gs-height="6"] {
        min-height: 450px !important;
    }

    .grid-stack-one-column-mode .grid-stack-item[data-gs-height="8"] {
        min-height: 500px !important;
    }
}

/* STOCKS SHORTS */
@media screen and (max-width: 992px) {
    .widgets {
        height: 100% !important;
        width: 100%;
        overflow: auto;
    }

    .widget.data_row {
        height: unset !important;
        position: static !important;
    }

    .widget_content.data_row {
        height: unset;
    }

    .data_row_box > .widget_box_top {
        flex: 1 0 300px;
        border-bottom: 1px solid rgba(255, 255, 255, 0.15);
    }

    .widget.high_chart_big_v5 {
        position: relative !important;
        height: 460px !important;
        display: flex;
        flex-direction: column;
    }

    .widget_content.high_chart_big_v5 {
        flex: 1;
        display: flex;
        flex-direction: column;
    }

    .chart_buttons_row {
        position: static !important;
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-end;
        background: #0b1619;
    }

    .chart_buttons_row > .search_button {
        font-size: 1em;
    }

    .widget_content.high_chart_big_v5 > .chart {
        height: unset !important;
        flex: 1;
    }
}

/* ALPHA */
@media screen and (max-width: 992px) {
    .widget_content.list_with_sub_item_api .dataTables_scrollBody {
        box-sizing: border-box;
        /* overflow: unset !important; */
        /* overflow-y: auto !important; */
    }

    .item_list {
        overflow: unset;
    }
}

/* SCREENING */
.button_row_content > .column_sets {
    flex: 1 1 300px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.column_sets > .desc {
    margin: 0 !important;
    padding-left: 5px !important;
}

.export_buttons {
    display: flex;
    top: 5px;
    right: 5px !important;
}

@media screen and (max-width: 992px) {
    .widget.screening_table {
        height: calc(100vh - calc(var(--header-height) * 2)) !important;
        display: flex;
        flex-direction: column;
        max-height: unset !important;
        padding-bottom: 0 !important;
        width: unset !important;
    }

    .widget_content.screening_table {
        display: flex;
        flex-direction: column-reverse;
        flex: 1;
    }

    #w_list_screening_table.item_list {
        flex: 1;
        height: calc(100% - 40px) !important;
    }

    .widget_button_row {
        position: relative !important;
        width: unset;
        height: unset !important;
        display: flex !important;
        flex-wrap: wrap;
        margin: 0;
        padding: 0;
    }

    .widget_button_row > .button_row_content {
        display: flex !important;
        flex-wrap: wrap;
        grid-auto-flow: unset;
        grid-gap: unset;
        margin: 0;
        padding: 5px 0;
    }

    .button_row_content > .column_sets {
        margin: 5px 0 0;
    }
}

/* MODAL */
@media screen and (max-width: 992px) {
    .modal-dialog {
        max-width: calc(100vw - 20px) !important;
        overflow: hidden;
    }

    .modal-dialog > .modal-content {
        box-sizing: border-box;
        min-width: unset !important;
    }
}