.retell-card{
    background:#fff;
    border:1px solid rgb(230,233,236);
    border-radius:8px;
    padding:16px;
    box-shadow:0 1px 2px rgba(0,0,0,.05);
    font-family:Arial,Helvetica,sans-serif;
}

.retell-header{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:16px;
}

.retell-title{
    font-size:18px;
    font-weight:700;
    color:#145386;
}

.retell-title i{
    margin-right:6px;
}

.retell-time{
    color:#6b7280;
    font-size:13px;
}

.retell-pills{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-bottom:16px;
}

.retell-pill{
    display:inline-flex;
    align-items:center;
    gap:6px;
    padding:6px 12px;
    border-radius:20px;
    font-size:12px;
    font-weight:600;
}

.retell-duration{
    background:#EEF6FF;
    color:#145386;
}

.retell-success{
    background:#E8F8F0;
    color:#1B7F4B;
}

.retell-sentiment{
    background:#FFF7E6;
    color:#C97A00;
}

.retell-status{
    background:#F3F4F6;
    color:#4B5563;
}

.retell-summary{
    background:#F9FAFB;
    border-left:4px solid #145386;
    border-radius:6px;
    padding:14px;
    margin-bottom:16px;
}

.retell-summary-title{
    font-size:13px;
    font-weight:700;
    color:#145386;
    margin-bottom:8px;
}

.retell-summary-text{
    color:#374151;
    line-height:1.6;
}

.retell-footer{
    display:flex;
    justify-content:space-between;
    align-items:center;
}

.retell-footer-text{
    color:#6b7280;
    font-size:13px;
}

.retell-btn{
    display:inline-block;
    background:#4DA57F;
    color:#fff !important;
    text-decoration:none;
    padding:8px 16px;
    border-radius:6px;
    font-size:13px;
    font-weight:600;
    transition:.2s;
}

.retell-btn:hover{
    background:#3f906d;
    color:#fff !important;
    text-decoration:none;
}


.retell-transcript{
    font-family:Arial, Helvetica, sans-serif;
    margin-top:12px;
}

.transcript-row{
    padding:10px 12px;
    border-radius:8px;
    margin-bottom:8px;
    line-height:1.5;
}

.user-row{
    background:#EEF6FF;
    border-left:4px solid #145386;
}

.agent-row{
    background:#F9FAFB;
    border-left:4px solid #D1D5DB;
}

.speaker{
    display:inline-block;
    font-size:12px;
    font-weight:700;
    margin-bottom:4px;
    text-transform:uppercase;
}

.user-speaker{
    color:#145386;
}

.agent-speaker{
    color:#6B7280;
}

.message{
    font-size:14px;
    color:#374151;
}