/* nps.css — Aba NPS (Sprint 8) */
.nps-page { display: flex; flex-direction: column; gap: 14px; }
.nps-filters { display: flex; flex-wrap: wrap; gap: 8px; }
.nps-kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
@media (max-width: 1100px) { .nps-kpis { grid-template-columns: repeat(2, 1fr); } }
.nps-kpis .k-value { font-size: 26px; }

.nps-charts { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
@media (max-width: 1100px) { .nps-charts { grid-template-columns: 1fr; } }
.nps-charts .panel { display: flex; flex-direction: column; min-height: 240px; }
.nps-charts .panel canvas { flex: 1; max-height: 240px; width: 100% !important; }

.nps-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.nps-table th { text-align: left; font-weight: 500; color: var(--az-text-secondary); font-size: 11px;
  text-transform: uppercase; letter-spacing: .4px; padding: 8px 10px; border-bottom: .5px solid var(--az-border-secondary); }
.nps-table th.r, .nps-table td.r { text-align: right; }
.nps-table td { padding: 9px 10px; border-bottom: .5px solid var(--az-border-tertiary); }
.nps-table tbody tr.nps-row { cursor: pointer; }
.nps-table tbody tr.nps-row:hover { background: var(--az-bg-secondary); }
.nps-table td.cmt { max-width: 280px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--az-text-secondary); }

.nps-pill { display: inline-block; min-width: 26px; padding: 2px 8px; border-radius: 999px; font-weight: 600; font-size: 12px; }
.nps-pill.nps-promoter  { background: var(--az-success-50); color: var(--az-success-700); }
.nps-pill.nps-neutral   { background: var(--az-warning-50); color: var(--az-warning-700); }
.nps-pill.nps-detractor { background: var(--az-danger-50);  color: var(--az-danger-700); }

.src-badge { display: inline-block; padding: 2px 8px; border-radius: 999px; font-size: 11px; font-weight: 500; white-space: nowrap; }
.src-badge.src-survey      { background: var(--az-primary-50); color: var(--az-primary); }
.src-badge.src-participant { background: var(--az-bg-tertiary); color: var(--az-text-secondary); }
