.drawer {
    position: fixed;
    z-index: 3;
    bottom: 0;
    left: 0;
    width: 100%;
    max-height: calc(100% - 7rem);
    box-shadow: var(--elevation-5);
    transition: transform .45s var(--decelerate-easing);
    display: flex;
    flex-direction: column;
    border-radius: 2rem 2rem 0 0;
}

.drawer.tiny {
    height: auto;
}

.drawer>section {
    height: 100%;
    overflow-y: auto;
    position: relative;
}

.drawer>section form>div:not(:has(ul.list)) {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
}

.drawer:empty {
    transition: transform 0.45s var(--accelerate-easing);
    transform: translateY(100%);
    pointer-events: none;
    height: auto;
}

@media screen and (min-width: 570px) {
    .drawer {
        width: 70rem;
        left: calc(50% - 35rem);
    }
}

@media screen and (max-width: 570px) {
    .drawer~main, .drawer~nav {
        transition: transform .25s var(--decelerate-easing);
    }

    .drawer:not(:empty)~main,
    .drawer:not(:empty)~nav {
        transition: transform .25s var(--accelerate-easing);
        transform: translateY(-2rem);
    }
}


#drawer ul.list>li.search form div:after {
    background-color: rgb(var(--movim-background));
}

#drawer ul.list>li.search form div:focus-within:after {
    background-color: rgba(var(--movim-background), 0.8);
}
/* A local close action must work without server responses or route changes. */
#drawer-backdrop{position:fixed;inset:0;width:100%;height:100%;padding:0;border:0;background:#0005;z-index:299;cursor:default}
#drawer:not(:empty){z-index:300;background:rgb(var(--movim-background-main));isolation:isolate;padding-top:44px;box-sizing:border-box;max-height:calc(100dvh - 36px)}
#drawer>.drawer-close{position:absolute;top:4px;right:8px;z-index:3;width:36px;height:36px;padding:0;border:0;border-radius:50%;background:rgba(var(--movim-font),.07);color:rgb(var(--movim-font));font-size:26px;line-height:36px;cursor:pointer}
#drawer>.scroll{min-height:0;overscroll-behavior:contain}
#drawer .tabelem.hide{display:none!important}
#drawer[data-type=room_drawer] header.big{height:auto;min-height:0;background-image:none!important;background:transparent;color:rgb(var(--movim-font));padding:8px 12px}
#drawer[data-type=room_drawer] header.big ul.list>li{min-height:64px;padding:0}
#drawer[data-type=room_drawer] header.big .primary{width:48px;height:48px;min-width:48px;border-radius:14px;background-size:cover}
#drawer[data-type=room_drawer] #room_members>br,#drawer[data-type=room_drawer] #room_members>hr{display:none}
#drawer[data-type=room_drawer] #navtabs{position:sticky;top:0;background:rgb(var(--movim-background-main));z-index:1;margin:8px 0}
#drawer[data-type=room_drawer] header.big ul.list>li{display:flex;align-items:center;gap:10px}
#drawer[data-type=room_drawer] header.big ul.list>li>.primary{position:static;flex:0 0 48px;margin:0;order:0}
#drawer[data-type=room_drawer] header.big ul.list>li>div{order:1;flex:1;min-width:0;width:auto;margin:0;padding:0}
#drawer[data-type=room_drawer] header.big ul.list>li>.control{position:static;order:2;flex:0 0 32px;width:32px;margin:0;padding:0}
#drawer[data-type=room_drawer] header.big{box-sizing:border-box}

#room-delivery-status{margin:8px 16px;padding:10px 12px;border-radius:12px;background:rgba(var(--movim-font),.04);font-size:13px;overflow-wrap:anywhere}
#room-delivery-status[hidden]{display:none}
#room-delivery-status summary{cursor:pointer}
#room-delivery-status details>div{margin-top:8px}
#room-delivery-status small{display:block;margin-top:8px;opacity:.65}