/* AI GOVERNANCE B (26 сентября 2026, план 7b): расход на «Оплате», карточка
   «Подтвердить» в чате Boro, отзыв «Всегда разрешать», чек-лист квалификации
   на карточке сделки. Те же токены, что у «Помощи с запуском»
   (team-onboarding.css): --rp-* с запасными значениями. Всё сжимается до
   375 px без горизонтальной прокрутки: min-width: 0 у каждой ячейки сетки. */

/* ── /settings/billing: что AI израсходовал за месяц ───────────────────── */
.billing-usage-meter { display: grid; gap: var(--rp-3, 12px); min-width: 0; }
.usage-meter-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: var(--rp-3, 12px);
}
.usage-meter-card {
  display: grid;
  align-content: start;
  gap: var(--rp-2, 8px);
  padding: var(--rp-4, 16px);
  border: 1px solid var(--rp-line, rgba(127, 127, 127, 0.2));
  border-radius: var(--rp-r, 12px);
  background: var(--rp-panel, transparent);
  min-width: 0;
}
.usage-meter-card-head { display: flex; align-items: center; gap: var(--rp-2, 8px); min-width: 0; }
.usage-meter-card-head strong { font-size: 15px; overflow-wrap: anywhere; }
.usage-meter-icon { font-size: 18px; line-height: 1; }
.usage-meter-line { display: grid; gap: 6px; min-width: 0; }
.usage-meter-line-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 4px 8px; min-width: 0; }
.usage-meter-label { color: var(--rp-ink-2, #a7b4c8); font-size: 13px; overflow-wrap: anywhere; }
.usage-meter-value { font-size: 18px; font-weight: 650; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.usage-meter-line.is-not_counted .usage-meter-value,
.usage-meter-line.is-missing .usage-meter-value { font-size: 14px; font-weight: 560; color: var(--rp-ink-2, #a7b4c8); }
.usage-meter-sub { color: var(--rp-ink-2, #a7b4c8); font-size: 12px; overflow-wrap: anywhere; }
.usage-meter-track {
  height: 6px;
  border-radius: 999px;
  background: var(--rp-line, rgba(127, 127, 127, 0.2));
  overflow: hidden;
}
.usage-meter-fill { display: block; height: 100%; border-radius: inherit; background: rgb(var(--ch-blue, 59 130 246)); }
.usage-meter-line.is-over .usage-meter-fill { background: var(--rp-red, #ef4444); }
.usage-meter-line.is-over .usage-meter-sub { color: var(--rp-red, #ef4444); }

/* ── карточка сделки: чек-лист квалификации ─────────────────────────────── */
.lw-qual-group { display: grid; gap: var(--rp-2, 8px); min-width: 0; }
.lw-qual-checklist { min-width: 0; }
.qcl-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 4px 8px; }
.qcl-head .lw-section-title { margin: 0; }
.qcl-progress { font-size: 12px; font-weight: 650; color: var(--rp-ink-2, #a7b4c8); font-variant-numeric: tabular-nums; }
.qcl-vertical { margin: 4px 0 8px; font-size: 12px; color: var(--rp-ink-2, #a7b4c8); overflow-wrap: anywhere; }
.qcl-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.qcl-row {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr) minmax(0, 1.2fr);
  gap: 8px;
  align-items: baseline;
  font-size: 13px;
  min-width: 0;
}
.qcl-mark { color: var(--rp-ink-2, #a7b4c8); font-weight: 700; text-align: center; }
.qcl-row.is-done .qcl-mark { color: var(--rp-green, #22c55e); }
.qcl-label { overflow-wrap: anywhere; }
.qcl-value { overflow-wrap: anywhere; font-weight: 560; }
.qcl-value.is-empty { font-weight: 400; color: var(--rp-ink-2, #a7b4c8); }
.qcl-note { margin: 8px 0 0; font-size: 12px; color: var(--rp-ink-2, #a7b4c8); }
.qcl-note-ok { color: var(--rp-green, #22c55e); }
.qcl-note-warn { color: var(--rp-amber, #f59e0b); }
.qcl-missing { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 8px; font-size: 12px; }
.qcl-missing span { flex: 1 1 200px; min-width: 0; color: var(--rp-ink-2, #a7b4c8); }
.qcl-foot { margin-top: 6px; }
.qcl-editor { display: grid; gap: 8px; margin-top: 10px; padding-top: 10px; border-top: 1px dashed var(--rp-line, rgba(127, 127, 127, 0.25)); min-width: 0; }
.qcl-editor-row { display: grid; gap: 4px; font-size: 12px; }
.qcl-editor select, .qcl-editor input[type="text"] { width: 100%; min-width: 0; box-sizing: border-box; }
.qcl-editor-items { margin: 0; padding: 0; list-style: none; display: grid; gap: 6px; }
.qcl-editor-item { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; gap: 6px; align-items: center; }
.qcl-editor-actions { display: flex; flex-wrap: wrap; gap: 6px; }
@media (max-width: 560px) {
  .qcl-row { grid-template-columns: 18px minmax(0, 1fr); row-gap: 0; }
  .qcl-list { gap: 8px; }
  .qcl-value { grid-column: 2; }
  .qcl-editor-item { grid-template-columns: minmax(0, 1fr) auto; }
  .qcl-editor-item select { grid-column: 1 / -1; grid-row: 2; }
}

/* ── чат Boro: «Подтвердить» изменение сделки ───────────────────────────── */
.boro-crm-action {
  display: grid;
  gap: 6px;
  margin-top: 8px;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid rgb(var(--ch-blue, 59 130 246) / 0.45);
  background: rgb(var(--ch-blue, 59 130 246) / 0.08);
  min-width: 0;
}
.boro-crm-action-title { font-size: 12px; letter-spacing: 0.02em; }
.boro-crm-action-summary { margin: 0; font-size: 13px; overflow-wrap: anywhere; }
.boro-crm-action-always { display: flex; align-items: center; gap: 6px; font-size: 12px; cursor: pointer; }
.boro-crm-action-hint { font-size: 11px; opacity: 0.75; overflow-wrap: anywhere; }
.boro-crm-action-buttons { margin-top: 2px; }
.boro-crm-action-status { margin: 0; font-size: 12px; overflow-wrap: anywhere; }
.boro-crm-action-done, .boro-crm-action-done .boro-crm-action-status { border-color: rgb(34 197 94 / 0.45); }
.boro-crm-action-done { background: rgb(34 197 94 / 0.08); }
.boro-crm-action-failed, .boro-crm-action-expired { border-color: rgb(245 158 11 / 0.55); background: rgb(245 158 11 / 0.08); }
.boro-crm-action-cancelled { opacity: 0.7; }

/* ── Настройки: что Boro меняет без подтверждения ───────────────────────── */
.boro-allowance-list { list-style: none; margin: 8px 0 0; padding: 0; display: grid; gap: 8px; }
.boro-allowance-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 10px 12px;
  border: 1px solid var(--rp-line, rgba(127, 127, 127, 0.2));
  border-radius: var(--rp-r, 12px);
  min-width: 0;
}
.boro-allowance-main { display: grid; gap: 2px; min-width: 0; flex: 1 1 200px; }
.boro-allowance-main span { font-size: 12px; color: var(--rp-ink-2, #a7b4c8); overflow-wrap: anywhere; }
.boro-allowance-note-ok { color: var(--rp-green, #22c55e); }
.boro-allowance-note-warn { color: var(--rp-amber, #f59e0b); }