/* Club call surveys share the existing workspace colours and controls. */
.calls-panel { margin-top: 28px; min-width: 0; }
body .calls-panel button.secondary { min-height: 40px; padding: 9px 14px; }
.calls-heading { align-items: flex-start; gap: 16px; }
.calls-heading h3 { margin: 0; font-size: 19px; }
.calls-heading p { margin: 5px 0 0; font-size: 14px; }
.calls-state { margin: 20px 0 4px; font-weight: 700; }
.calls-state[data-state="active"] { color: var(--green); }
.calls-sync { margin: 0 0 16px; font-size: 13px; }
.calls-notice { padding: 14px 16px; background: var(--warn-bg); border: 1px solid var(--warn-border); border-radius: 7px; color: var(--amber); font-size: 14px; }
.calls-error { color: var(--danger); font-size: 14px; }
.calls-operation-errors { margin: 16px 0; padding: 0; list-style: none; }
.calls-operation-errors li { display: grid; gap: 4px; padding-left: 12px; border-left: 2px solid var(--danger); overflow-wrap: anywhere; }
.calls-operation-errors li + li { margin-top: 14px; }
.calls-operation-errors small { font-size: 12px; }
.calls-summary { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); margin: 22px 0; border: 1px solid var(--line); border-radius: 8px; }
.calls-summary > div { padding: 16px 20px; border-right: 1px solid var(--line); }
.calls-summary > div:last-child { border-right: 0; }
.calls-summary dt { color: var(--muted); font-size: 13px; }
.calls-summary dd { margin: 6px 0 0; font-size: 24px; font-weight: 700; }
.calls-sections { display: flex; flex-wrap: wrap; gap: 8px; margin: 24px 0; }
body .app .calls-sections button[aria-pressed="true"] { background: var(--accent-soft); color: var(--blue); border-color: var(--accent); }
.calls-list { display: grid; gap: 12px; }
.calls-filters { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px 18px; padding-bottom: 20px; border-bottom: 1px solid var(--line); }
.calls-filters label { min-width: 0; margin: 0; font-size: 13px; }
.calls-filters select, .calls-filters input { width: 100%; min-width: 0; height: 44px; margin: 0; font-size: 14px; color-scheme: dark; }
.calls-filter-actions { display: flex; align-items: flex-end; gap: 8px; }
.calls-filter-actions button { min-height: 44px; }
.calls-filter-error { grid-column: 1 / -1; margin: 0; color: var(--danger); font-size: 13px; }
.calls-card { min-width: 0; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); padding: 18px 20px; }
.calls-card > header { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 8px 18px; }
.calls-phone { font-size: 16px; overflow-wrap: anywhere; }
.calls-status { color: var(--muted); font-size: 13px; }
.calls-card-info, .calls-attempt-info { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px 20px; margin: 18px 0; }
.calls-card-info dt, .calls-attempt-info dt { font-size: 12px; color: var(--muted); }
.calls-card-info dd, .calls-attempt-info dd { margin: 4px 0 0; font-size: 14px; overflow-wrap: anywhere; }
.calls-rating { font-weight: 700; }
.calls-rating small { display: block; color: var(--muted); font-size: 12px; font-weight: 400; }
.calls-comment { padding: 10px 12px; border-left: 2px solid var(--line-strong); color: var(--text); white-space: pre-wrap; overflow-wrap: anywhere; font-size: 14px; }
.calls-details { border-top: 1px solid var(--line); padding-top: 12px; }
.calls-details > summary { cursor: pointer; color: var(--blue); font-size: 14px; }
.calls-identifiers { font-size: 12px; overflow-wrap: anywhere; }
.calls-attempts { margin: 12px 0 0; padding: 0; list-style: none; display: grid; gap: 12px; }
.calls-attempt { padding: 14px 16px; background: var(--ink); border: 1px solid var(--line); border-radius: 6px; }
.calls-attempt-head { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; font-size: 14px; }
.calls-attempt-head > span { color: var(--muted); }
.calls-attempt-info { margin: 12px 0; }
.calls-recording audio { width: min(100%, 480px); display: block; }
.calls-recording p, .calls-no-recording { font-size: 13px; margin: 8px 0 0; }
.calls-recording p:empty { display: none; }
.calls-spoken-responses { display: grid; gap: 12px; margin: 16px 0 0; }
.calls-spoken-responses dt { font-size: 12px; color: var(--muted); }
.calls-spoken-responses dd { margin: 4px 0 0; font-size: 14px; line-height: 1.6; white-space: pre-wrap; overflow-wrap: anywhere; }
.calls-transcription { margin-top: 16px; padding-top: 12px; border-top: 1px solid var(--line); min-width: 0; }
.calls-transcription h4 { margin: 0 0 6px; font-size: 14px; }
.calls-transcription p { margin: 6px 0 0; font-size: 13px; }
.calls-transcription button { margin-top: 12px; }
.calls-transcription .calls-transcription-text { color: var(--text); font-size: 14px; line-height: 1.6; white-space: pre-wrap; overflow-wrap: anywhere; }
.calls-pagination { display: flex; align-items: center; justify-content: center; gap: 16px; margin-top: 24px; font-size: 14px; color: var(--muted); }
.calls-settings { max-width: 1080px; }
.calls-settings h4 { font-size: 16px; margin: 0 0 12px; }
.calls-rules { border-bottom: 1px solid var(--line); padding-bottom: 20px; margin-bottom: 24px; }
.calls-rules ul { margin: 0; padding-left: 20px; color: var(--muted); font-size: 14px; }
.calls-rules li + li { margin-top: 6px; }
.calls-settings-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 32px; }
.calls-settings-form label { min-width: 0; }
.calls-settings-form input { width: 100%; min-width: 0; }
.calls-settings-form small { font-size: 12px; line-height: 1.5; }
.calls-connections p { margin: 0 0 12px; color: var(--muted); font-size: 14px; }
.calls-records { margin: 26px 0 0; padding: 18px 0; border: 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); min-width: 0; }
.calls-records legend { padding-right: 12px; font-weight: 700; font-size: 16px; }
.calls-records > p { margin: 0 0 16px; font-size: 14px; }
.calls-record-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.calls-capabilities { margin: 24px 0; }
.calls-capabilities p { margin: 5px 0; font-size: 14px; }
.calls-capabilities strong { font-weight: 400; }
.calls-enable { display: flex; flex-direction: row; align-items: center; gap: 10px; }
.calls-settings-form .calls-enable input { width: 18px; height: 18px; flex: 0 0 auto; }
#callsEnableHint { font-size: 13px; margin: 8px 0 20px; }
.calls-save { display: flex; flex-wrap: wrap; gap: 12px; justify-content: flex-end; padding-top: 18px; border-top: 1px solid var(--line); }
.calls-save output { margin-right: auto; align-self: center; }
@media (max-width: 1050px) {
  .calls-summary { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .calls-summary > div { padding: 14px 12px; }
  .calls-summary > div:nth-child(3) { border-right: 0; }
  .calls-summary > div:nth-child(-n+3) { border-bottom: 1px solid var(--line); }
  .calls-summary dt { min-height: 38px; }
  .calls-settings-grid { gap: 20px; }
}
@media (max-width: 680px) {
  .calls-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 10px; }
  .calls-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .calls-summary > div { border-bottom: 1px solid var(--line); }
  .calls-summary > div:nth-child(3) { border-right: 1px solid var(--line); }
  .calls-summary > div:nth-child(even) { border-right: 0; }
  .calls-summary > div:nth-last-child(-n+2) { border-bottom: 0; }
  .calls-summary dt { min-height: 0; }
  .calls-summary dd { font-size: 21px; }
  .calls-card { padding: 16px; }
  .calls-card-info, .calls-attempt-info { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
  .calls-attempt { padding: 12px; }
  .calls-settings-grid, .calls-record-grid { grid-template-columns: minmax(0, 1fr); gap: 18px; }
  .calls-save button { width: 100%; }
}
@media (max-width: 400px) {
  .calls-filters { grid-template-columns: minmax(0, 1fr); }
}