.bc-drawer[data-edit], .bc-drawer[data-edit] *{
pointer-events: none !important;
}
.bc-drawer__overlay{
--overlay-duration: .4s;
--overlay-easing: cubic-bezier(.32,.72,0,1);
transition: opacity var(--overlay-duration) var(--overlay-easing); opacity: 0;
pointer-events: none;
position: fixed;
top: 0;
left: 0;
z-index: 99998; width: 100vw;
height: 100vh;
background-color: rgba(0,0,0,.8); }
.bc-drawer__overlay[data-open]{
opacity: 1;
pointer-events: all;
}
.bc-drawer__drawer{
--drawer-duration: .4s;
--drawer-easing: cubic-bezier(.32,.72,0,1);
transition: transform var(--drawer-duration) var(--drawer-easing); position: fixed;
transform: translateY(100%);
bottom: 0;
left: 0;
z-index: 99999; width: 100%;
height: 500px;
display: flex; flex-direction: column;
align-items: center;
padding: 15px 150px; background-color: hsl(240 10% 3.9%);
border: 1px solid #27272A;
border-top-left-radius: 10px;
border-top-right-radius: 10px; -webkit-user-select: none;
-ms-user-select: none;
user-select: none;
}
.bc-drawer__drawer[data-close]{
transform: translateY(100%) !important;
}
.bc-drawer__drawer[data-open]{
transform: translateY(0%);
}
.bc-drawer__drag{ width: 100px;
height: 8px;
border-radius: 100px;
background-color: hsl(240 3.7% 15.9%);
}