/* ELEMENTARY Recovery Wave 2 — shared left-menu/topbar family */
html.ec-shared-family,
body.ec-shared-family{
    min-height:100%;
    margin:0;
    background:#f4f7fb;
}

body.ec-shared-family{
    display:grid!important;
    grid-template-columns:300px minmax(0,1fr)!important;
    align-items:start;
    min-height:100vh;
    overflow-x:hidden;
}

body.ec-shared-family > .ec-shared-sidebar{
    grid-column:1;
}

body.ec-shared-family > .shell{
    grid-column:2;
    min-width:0;
    width:auto!important;
    max-width:none!important;
    margin:0!important;
    padding:24px 28px 36px!important;
}

.ec-shared-sidebar{
    box-sizing:border-box;
    position:sticky!important;
    inset-block-start:0;
    width:300px!important;
    height:100vh!important;
    max-height:100vh!important;
    overflow-y:auto!important;
    padding:24px 18px!important;
    background:#0b0b0c!important;
    color:#fff!important;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
    scrollbar-width:thin;
    scrollbar-color:#6b7280 transparent;
}

.ec-shared-sidebar .brand{
    display:flex;
    align-items:flex-start;
    gap:12px;
    padding:0 4px 20px;
    border-bottom:1px solid #27272a;
}

.ec-shared-sidebar .mark{
    display:grid;
    place-items:center;
    flex:0 0 38px;
    width:38px;
    height:38px;
    border:1px solid #3f3f46;
    border-radius:12px;
    color:#fff;
    font-weight:900;
}

.ec-shared-sidebar .brand-title{
    color:#fff;
    font-size:16px;
    line-height:1.25;
    font-weight:900;
}

.ec-shared-sidebar .brand-sub{
    margin-top:5px;
    color:#9ca3af;
    font-size:12px;
    line-height:1.45;
}

.ec-shared-sidebar .nav{
    display:grid;
    gap:4px;
    padding-top:12px;
}

.ec-shared-sidebar .nav-section{
    margin:15px 4px 5px;
    color:#93c5fd;
    font-size:11px;
    line-height:1.2;
    font-weight:900;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.ec-shared-sidebar .nav a,
.ec-shared-sidebar .nav-disabled{
    display:flex;
    align-items:center;
    min-height:42px;
    box-sizing:border-box;
    padding:9px 12px;
    border-radius:10px;
    color:#f4f4f5;
    font-size:15px;
    line-height:1.35;
    text-decoration:none;
}

.ec-shared-sidebar .nav a:hover{
    background:#1f1f22;
}

.ec-shared-sidebar .nav a.active,
.ec-shared-sidebar .nav a[aria-current="page"]{
    background:#27272a;
    color:#fff;
    box-shadow:inset 3px 0 0 #f97316;
}

.ec-shared-sidebar .nav-disabled{
    color:#6b7280;
    cursor:not-allowed;
}

.ec-shared-sidebar .ec-nav-toggle{
    display:none;
}

body.ec-shared-family .elementary-topbar{
    display:none!important;
}

body.ec-shared-family > .shell > :where(.hero,.card,.panel,.box,.section){
    min-width:0;
}

body.ec-shared-family :where(.table-wrap,.table-responsive){
    max-width:100%;
    overflow-x:auto;
}

body.ec-shared-family :where(input,select,textarea,button){
    max-width:100%;
}

body.ec-shared-family :where(input,select,textarea,button,a):focus-visible{
    outline:3px solid rgba(249,115,22,.45);
    outline-offset:2px;
}

@media(max-width:64rem){
    body.ec-shared-family{
        display:block!important;
    }

    body.ec-shared-family > .shell{
        padding:16px!important;
    }

    .ec-shared-sidebar{
        position:relative!important;
        width:100%!important;
        height:auto!important;
        max-height:none!important;
        padding:12px 14px!important;
    }

    .ec-shared-sidebar .ec-nav-toggle{
        display:flex;
        align-items:center;
        justify-content:center;
        width:100%;
        min-height:44px;
        border:1px solid #3f3f46;
        border-radius:10px;
        background:#18181b;
        color:#fff;
        font-weight:900;
    }

    .ec-shared-sidebar:not(.is-open) #ec-shared-navigation{
        display:none;
    }

    .ec-shared-sidebar.is-open #ec-shared-navigation{
        margin-top:12px;
    }
}

@media print{
    .ec-shared-sidebar{
        display:none!important;
    }

    body.ec-shared-family{
        display:block!important;
    }

    body.ec-shared-family > .shell{
        padding:0!important;
    }
}

/* ELEMENTARY shared sidebar sticky brand */
.ec-shared-sidebar .brand{
    position:sticky;
    top:-24px;
    z-index:4;
    padding-top:24px;
    background:#0b0b0c;
}