/* <Drawer /> — default styling, lm-drawer-* convention.
   The Modal primitive provides the panel (left/right are full-height side
   panels, bottom is the sheet); the drawer adds the slide-in animation per
   anchor and the body chrome, scoped under .lm-drawer; the header
   (title + close) is Modal's own. */

.lm-drawer .lm-modal {
    min-width: 0; /* the width prop is authoritative, not Modal's 280px floor */
}

/* Slide in from the anchored edge — replays on every open because the
   branch (re)attaches to the document */
.lm-drawer[data-anchor='left'] .lm-modal {
    animation: lm-drawer-slide-left 0.25s ease;
}

.lm-drawer[data-anchor='right'] .lm-modal {
    animation: lm-drawer-slide-right 0.25s ease;
}

.lm-drawer[data-anchor='bottom'] .lm-modal {
    animation: lm-drawer-slide-up 0.25s ease;
    width: 100% !important; /* bottom sheet: full width, width prop ignored */
    max-width: 100%;
    border-radius: 12px 12px 0 0;
}

@keyframes lm-drawer-slide-left {
    from { transform: translateX(-100%); }
    to { transform: translateX(0); }
}

@keyframes lm-drawer-slide-right {
    from { transform: translateX(100%); }
    to { transform: translateX(0); }
}

@keyframes lm-drawer-slide-up {
    from { transform: translateY(100%); }
    to { transform: translateY(0); }
}

/* Modal renders the header; the drawer owns only the scrolling body */
.lm-drawer .lm-modal-content {
    display: flex;
    flex-direction: column;
    padding: 0;
    overflow: hidden;
}

.lm-drawer-body {
    flex: 1;
    padding: 16px;
    overflow: auto;
}