.calls-actions,.calls-sync-state,.calls-pagination{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.calls-summary{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:24px}.calls-summary>div{background:white;border:1px solid #e5dfed;border-radius:16px;padding:22px}.calls-summary small{display:block;color:#70647d;margin-bottom:12px}.calls-summary strong{font-size:30px;color:#361266}.calls-summary .calls-date{font-size:16px}.calls-sync-state{margin:18px 0;color:#6c5f77}.calls-filters{display:flex;gap:16px;align-items:end;margin:22px 0}.calls-filters label:first-child{flex:1}.calls-filters label{margin:0}.calls-table small{display:block;margin-top:7px;color:#7b7185}.calls-table td{vertical-align:middle}.calls-flag{color:#a65d29!important}.calls-pagination{justify-content:space-between;margin-top:18px}.call-detail{max-width:850px}.call-meta{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;background:#f5f2fa;border-radius:12px;padding:16px;margin-bottom:20px}.call-meta small,.call-meta strong{display:block;margin:5px 0}.call-meta strong{text-align:right}.call-recording{border:1px solid #e5dfed;border-radius:12px;padding:16px}.call-recording audio{width:100%;margin:10px 0}.call-recording small{display:block;color:#766c80;margin-top:10px}.call-summary{padding:16px 0;white-space:pre-wrap;line-height:1.9}.call-review{border-block:1px solid #e5dfed;margin:20px 0;padding:18px 0}.call-review summary{font-weight:700;cursor:pointer}.call-review p{color:#74677e;line-height:1.8}.call-transcript{display:flex;flex-direction:column;gap:16px;margin:20px 0}.call-turn{padding:16px 20px;border-radius:14px;background:#f4f0fa;max-width:94%;border:1px solid #e9e2f3}.call-turn.caller{background:#fff8f1;border-color:#f2e5d8;align-self:flex-end;min-width:55%}.call-turn header{display:flex;justify-content:space-between;gap:28px;color:#665573;font-size:13px}.call-turn p{margin:12px 0 0;line-height:1.95;white-space:pre-wrap;overflow-wrap:anywhere}.call-turn small{display:block;margin-top:10px}.call-detail details>summary{cursor:pointer}@media(max-width:800px){.calls-summary{grid-template-columns:repeat(2,1fr)}.calls-filters{flex-wrap:wrap}.calls-filters label:first-child{flex-basis:100%}.call-meta{grid-template-columns:1fr}.call-turn{max-width:100%}.calls-actions{margin-top:12px}}
