/*
 * Reversible shell experiment: Stats at the top, header and Filter at the bottom.
 * Remove this stylesheet enqueue to restore the previous shell positions.
 */
body.ne-shell-stats-top {
    --ne-top-stats-height: 40px;
    --ne-bottom-header-height: 45px;
    --ne-bottom-menu-left: 52px;
}

body.ne-shell-stats-top #stats_tab {
    top: 0;
    bottom: auto;
}

body.ne-shell-stats-top #user_tab,
body.ne-shell-stats-top #user_tab.active {
    top: auto;
    bottom: 0;
}

body.ne-shell-stats-top #ne_dash,
body.ne-shell-stats-top #ne_dash.active {
    position: fixed !important;
    top: auto !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: var(--ne-bottom-header-height) !important;
    opacity: 1 !important;
    overflow: visible !important;
}

body.ne-shell-stats-top #ne_dash.expand {
    top: var(--ne-top-stats-height) !important;
    bottom: 0 !important;
    height: calc(100vh - var(--ne-top-stats-height)) !important;
    opacity: 1 !important;
    overflow-y: auto !important;
}

body.ne-shell-stats-top #ne_dash #ne_dash_menu,
body.ne-shell-stats-top #ne_dash.minimal #ne_dash_menu {
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    bottom: auto !important;
    left: var(--ne-bottom-menu-left) !important;
    width: auto !important;
}

body.ne-shell-stats-top #ne_dash.expand #ne_dash_menu,
body.ne-shell-stats-top #ne_dash.minimal.expand #ne_dash_menu {
    position: relative !important;
    top: 0 !important;
    right: auto !important;
    bottom: auto !important;
    left: 0 !important;
    width: 100% !important;
}

body.ne-shell-stats-top #loader,
body.ne-shell-stats-top #loader.new,
body.ne-shell-stats-top #loader.active {
    top: auto;
    bottom: 0;
    height: var(--ne-bottom-header-height);
}

body.ne-shell-stats-top #ne_timeline_filter.ne-timeline-filter-v2 {
    top: auto;
    bottom: -100%;
    border-top: 1px solid #252525;
    border-bottom: 0;
    transition: bottom 0.2s ease-in;
}

body.ne-shell-stats-top #ne_timeline_filter.ne-timeline-filter-v2.active {
    top: auto;
    bottom: var(--ne-bottom-header-height);
    max-height: calc(100vh - var(--ne-top-stats-height) - var(--ne-bottom-header-height));
    transition: bottom 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

body.ne-shell-stats-top #ne_timeline_filter.ne-timeline-filter-v2.active.is-closing {
    top: auto;
    bottom: -100%;
}

body.ne-shell-stats-top #ne_view,
body.ne-shell-stats-top #ne_view.active,
body.ne-shell-stats-top #ne_view.active.expand {
    top: var(--ne-top-stats-height);
    height: calc(100vh - var(--ne-top-stats-height) - var(--ne-bottom-header-height));
    padding-top: 0;
}

@media screen and (min-width: 768px) {
    body.ne-shell-stats-top {
        --ne-bottom-header-height: 65px;
        --ne-bottom-menu-left: 69px;
    }
}
