.dm-bar{
    position:fixed;
    bottom:0;
    right:20px;
    width:280px;
    height:44px;
    background:#1c5ce6;
    color:#fff;
    border-radius:8px 8px 0 0;
    cursor:pointer;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:0 14px;
    font-size:15px;
    box-shadow:0 -2px 8px rgba(0,0,0,.25);
    z-index:999;
}
.dm-bar i{transition:transform .2s}
.dm-bar.open i{transform:rotate(180deg)}

/* ----------  COLLAPSIBLE PANEL  ---------- */
.dm-panel{
    position:fixed;
    bottom:44px;
    right:20px;
    width:280px;
    height:350px;
    background:#fff;
    border:1px solid #e5e7eb;
    border-bottom:none;
    display:none;
    flex-direction:column;
    box-shadow:0 -4px 12px rgba(0,0,0,.15);
    z-index:1000;
}
.dm-messages{flex:1;overflow-y:auto;padding:.6rem;display:flex;flex-direction:column;gap:.3rem}
.dm-message{display:flex;flex-direction:column;margin-bottom:.2rem}
.dm-message.own{align-items:flex-end}
.dm-message .body{background:#f3f4f6;padding:.4rem .7rem;border-radius:6px;max-width:70%}
.dm-message.own .body{background:#dbeafe}
.dm-composer{display:flex;border-top:1px solid #e5e7eb}
.dm-composer input{flex:1;border:none;padding:.6rem .8rem;outline:none}
.dm-composer button{padding:0 .8rem;border:none;background:#0d47a1;color:#fff;cursor:pointer}
.close-btn{margin-left:auto;margin-right:6px;cursor:pointer}
.dm-bar{display:none}