/* Cooperative shell, shared by guest, member, and admin workspaces. */
.cooperative-workspace {
    background: var(--kj-color-canvas, #f5f7f6);
    color: var(--kj-color-ink, #1f2933);
}

.cooperative-shell {
    align-items: stretch;
    background: var(--kj-color-canvas, #f5f7f6);
    gap: 1rem;
    min-height: 100dvh;
    padding: 1rem;
}

.cooperative-sidebar-landmark { display: contents; }

.cooperative-sidebar {
    align-self: flex-start;
    background: var(--kj-color-brand, #135058) !important;
    border-radius: .9rem !important;
    box-shadow: 0 12px 32px rgba(19, 80, 88, .14) !important;
    flex: 0 0 15rem;
    min-height: calc(100dvh - 2rem);
    overflow-x: hidden;
    overflow-y: auto;
    position: sticky;
    top: 1rem;
    width: 15rem !important;
    z-index: 20;
}

.cooperative-sidebar-brand {
    align-items: center;
    background: var(--kj-color-cream, #f1f2b5);
    display: flex;
    justify-content: center;
    min-height: 7.25rem;
    padding: .7rem;
}

.cooperative-sidebar-logo {
    display: block;
    height: auto;
    max-height: 6rem;
    max-width: 100%;
    object-fit: contain;
    width: auto;
}

.cooperative-workspace #content-wrapper {
    background: var(--kj-color-surface, #fff);
    border-radius: .9rem !important;
    box-shadow: 0 12px 32px rgba(31, 41, 51, .08) !important;
    min-width: 0;
}

.cooperative-topbar {
    border-bottom: 1px solid var(--kj-color-border, #d9e2e1);
    margin-bottom: 0 !important;
    min-height: 4.5rem;
}

.cooperative-topbar h5 {
    color: var(--kj-color-brand, #135058);
    font-size: 1.05rem;
    font-weight: 700;
}

.cooperative-main-content {
    min-width: 0;
    padding-bottom: 1.5rem;
    padding-top: 1.5rem;
}

.cooperative-footer {
    border-top: 1px solid var(--kj-color-border, #d9e2e1);
    min-height: 3.25rem !important;
}

.cooperative-drawer-backdrop {
    background: rgba(15, 65, 71, .48);
    border: 0;
    inset: 0;
    position: fixed;
    z-index: 19;
}

.cooperative-drawer-backdrop[hidden] { display: none; }
.cooperative-bottom-nav { display: none; }

@media (max-width: 991.98px) {
    .cooperative-shell {
        min-height: 100dvh;
        padding: 0 0 74px !important;
    }

    .cooperative-workspace #content-wrapper { min-width: 0; width: 100%; }

    .cooperative-workspace #wrapper .cooperative-sidebar {
        bottom: 0;
        left: 0;
        min-height: 100vh;
        overflow-y: auto;
        position: fixed;
        top: 0;
        transform: translateX(-105%);
        transition: transform var(--kj-motion-fast, .18s ease);
        width: min(18rem, calc(100vw - 1rem)) !important;
    }

    .cooperative-workspace #wrapper .cooperative-sidebar:not(.mobile-open),
    .cooperative-workspace #wrapper .cooperative-sidebar.toggled:not(.mobile-open) { transform: translateX(-105%); }
    .cooperative-workspace #wrapper .cooperative-sidebar.mobile-open { transform: translateX(0); }
    .cooperative-workspace #wrapper .cooperative-sidebar .nav-item .nav-link { padding: .85rem 1rem; text-align: left; width: auto; }
    .cooperative-workspace #wrapper .cooperative-sidebar .nav-item .nav-link span { display: inline; font-size: .88rem; }
    .cooperative-workspace #wrapper .cooperative-sidebar .nav-item .nav-link i { margin-right: .35rem; }
    .cooperative-sidebar-brand { min-height: 6.5rem; }
    .cooperative-sidebar-logo { max-height: 5.5rem; }
    .cooperative-topbar { min-height: 4rem; }
    .cooperative-main-content { padding-top: 1rem; }

    .cooperative-bottom-nav {
        align-items: stretch;
        background: rgba(255, 255, 255, .98);
        border-top: 1px solid var(--kj-color-border, #d9e2e1);
        bottom: 0;
        box-shadow: 0 -3px 14px rgba(31, 41, 51, .12);
        display: grid;
        grid-template-columns: repeat(5, 1fr);
        left: 0;
        min-height: 64px;
        padding: .35rem .25rem calc(.35rem + env(safe-area-inset-bottom));
        position: fixed;
        right: 0;
        z-index: 1040;
    }

    .cooperative-bottom-link {
        align-items: center;
        background: transparent;
        border: 0;
        color: var(--kj-color-muted, #66737f);
        display: flex;
        flex-direction: column;
        font-size: .7rem;
        justify-content: center;
        line-height: 1.1;
        min-width: 0;
        text-decoration: none;
    }

    .cooperative-bottom-link i { color: var(--kj-color-info, #2d8f9c); font-size: 1rem; margin-bottom: .25rem; }
    .cooperative-bottom-link.active,
    .cooperative-bottom-link:hover,
    .cooperative-bottom-link:focus-visible { color: var(--kj-color-brand, #135058); text-decoration: none; }
    .cooperative-bottom-link.active {
        background: var(--kj-color-info-soft, #e7f4f6);
        border-radius: .55rem;
        font-weight: 700;
    }
    .cooperative-bottom-link.active i { color: var(--kj-color-brand, #135058); }
}

@media (prefers-reduced-motion: reduce) {
    .cooperative-workspace #wrapper .cooperative-sidebar,
    .cooperative-bottom-link { transition: none !important; }
}