.green {
    background: rgba(0, 128, 0, 0.1);
}
.green1 {
    background: rgba(0, 128, 0, 0.2);
}
.red {
    background: rgba(255, 0, 0, 0.1);
}
.yellow {
    background: rgba(255, 255, 0, 0.1);
}

.com-one {
    cursor: pointer;
    display: inline-block;
    max-width: 280px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: bottom;
}
.com-one.is-open {
    white-space: normal;
    overflow: visible;
    max-width: 420px;
}

.c-modal[hidden] { display: none; }
.c-modal {
    position: fixed;
    inset: 0;
    background: rgba(20, 24, 28, 0.45);
    z-index: 1080;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
}
.c-modal-card {
    background: #fff;
    width: min(640px, 100%);
    max-height: 90vh;
    overflow: auto;
    border-radius: 8px;
    padding: 16px 18px 20px;
    box-shadow: 0 12px 40px rgba(0,0,0,.18);
}
.c-modal-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
}

.crm-item {
    border-bottom: 1px solid #eee;
    padding: 10px 0;
}
.crm-item-name { font-weight: 600; }
.crm-item-text { margin: 4px 0; }
.crm-item-meta { color: #6c757d; font-size: 13px; }

#c-history { padding-left: 18px; }
#c-history li { margin-bottom: 6px; }