/* ══════════════════════════════════════════════════════════════
   api.css — стили состояний загрузки/ошибок и элементов,
   связанных с данными реестра (BPApi). Подключается после
   shared.css на всех страницах, использующих api-ui.jsx.
   ══════════════════════════════════════════════════════════════ */

@keyframes bp-shimmer {
  0%   { background-position: -400px 0; }
  100% { background-position:  400px 0; }
}
.api-skeleton,
.ui-skeleton {
  background: linear-gradient(90deg, var(--ink-100) 0%, var(--ink-50) 40%, var(--ink-100) 80%);
  background-size: 800px 100%;
  animation: bp-shimmer 1.4s ease-in-out infinite;
  border-radius: 6px;
}
@media (prefers-reduced-motion: reduce) {
  .api-skeleton, .ui-skeleton { animation: none; }
}

/* Результаты поиска: карточка — div, а не ссылка (внутри есть свои ссылки) */
.result-card.is-div { cursor: pointer; }
.result-card.is-div:focus-visible { outline: 2px solid #2563EB; outline-offset: 2px; }
.result-card .result-title a { color: inherit; text-decoration: none; }
.result-card .result-title a:hover { color: #1D4ED8; }
.result-form.is-opf { max-width: 96px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.result-skel { pointer-events: none; }
.result-mode-note {
  font-size: 12px; color: var(--ink-500); margin: -6px 0 14px;
  display: flex; align-items: center; gap: 6px; flex-wrap: wrap;
}
.result-mode-note code {
  font-family: 'Onest', 'Inter', -apple-system, system-ui, sans-serif;
  background: var(--ink-100); padding: 1px 6px; border-radius: 4px; color: var(--ink-700);
}

/* Радио-список в фильтре (статусы) */
.sf-radio { display: flex; align-items: center; gap: 10px; padding: 6px 0; cursor: pointer; font-size: 13px; color: var(--ink-700); }
.sf-radio input { accent-color: #1D4ED8; width: 15px; height: 15px; margin: 0; cursor: pointer; }
.sf-radio .cnt { margin-left: auto; font-size: 12px; color: var(--ink-400); font-family: 'Onest', 'Inter', sans-serif; font-variant-numeric: tabular-nums; }

/* Profile: строка-примечание к пустому блоку */
.api-note {
  display: flex; gap: 8px; align-items: flex-start; padding: 10px 12px;
  background: var(--ink-50); border: 1px solid var(--ink-150); border-radius: 10px;
  font-size: 12.5px; color: var(--ink-600); line-height: 1.5;
}
.api-note.is-info    { background: #EFF6FF; border-color: #BFDBFE; color: #1E40AF; }
.api-note.is-warning { background: var(--warning-50); border-color: #FDE68A; color: #92400E; }
.api-note.is-danger  { background: #FEF2F2; border-color: #FECACA; color: #991B1B; }

/* Столбчатая диаграмма платежей */
.bp-bars { display: flex; align-items: flex-end; gap: 10px; height: 180px; padding-top: 18px; }
.bp-bar { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; min-width: 0; height: 100%; }
.bp-bar-fill {
  width: 100%; max-width: 56px; border-radius: 6px 6px 2px 2px;
  background: linear-gradient(180deg, #3B82F6 0%, #1D4ED8 100%);
  transition: height 500ms cubic-bezier(0.16, 1, 0.3, 1), opacity 120ms ease;
  position: relative;
}
.bp-bar.is-active .bp-bar-fill { background: linear-gradient(180deg, #1E40AF 0%, #1E3A8A 100%); }
.bp-bar:hover .bp-bar-fill { opacity: 0.85; }
.bp-bar-val { font-size: 11px; color: var(--ink-600); font-family: 'Onest', 'Inter', sans-serif; font-variant-numeric: tabular-nums; margin-bottom: 4px; white-space: nowrap; }
.bp-bar-lbl { font-size: 12px; color: var(--ink-500); margin-top: 6px; font-family: 'Onest', 'Inter', sans-serif; }
.bp-bar-btn { background: none; border: none; padding: 0; width: 100%; height: 100%; cursor: pointer; font-family: inherit; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; }

/* Таблицы госзакупок: фиксированная раскладка, длинный предмет — в 3 строки */
.proc-table { width: 100%; border-collapse: collapse; table-layout: fixed; min-width: 660px; }
.proc-clamp {
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;
  overflow: hidden; line-height: 1.45;
}
.proc-table td, .proc-table th { overflow-wrap: anywhere; }

/* Сетки плиток: 4 → 2 → 1 колонки на узких экранах */
.bp-grid-4, .bp-grid-3, .fin-tiles { display: grid; gap: 12px; }
.bp-grid-4 { grid-template-columns: repeat(4, 1fr); }
.bp-grid-3 { grid-template-columns: repeat(3, 1fr); }
.ind-overview-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
@media (max-width: 900px) {
  .bp-grid-4, .fin-tiles { grid-template-columns: repeat(2, 1fr) !important; }
  .ind-overview-grid { grid-template-columns: 1fr !important; }
}
@media (max-width: 560px) {
  .bp-grid-3 { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 400px) {
  .bp-grid-4, .bp-grid-3, .fin-tiles { grid-template-columns: 1fr !important; }
}

/* Граф связей */
.bp-graph-node { cursor: pointer; }
.bp-graph-node:hover circle { stroke: #1D4ED8; stroke-width: 2; }
.bp-graph-node text { pointer-events: none; }

/* Демо-плашка для вкладок с макетными данными */
.demo-banner {
  display: flex; gap: 10px; align-items: center; padding: 10px 14px; margin-bottom: 16px;
  background: var(--warning-50); border: 1px solid #FDE68A; border-radius: 10px;
  font-size: 13px; color: #92400E;
}

/* Список компаний в профиле человека */
.person-company-row {
  display: grid; grid-template-columns: 40px minmax(0,1fr) auto; gap: 14px; align-items: center;
  padding: 12px 0; border-bottom: 1px solid var(--ink-150);
}
.person-company-row:last-child { border-bottom: none; }
@media (max-width: 640px) {
  .person-company-row { grid-template-columns: 36px minmax(0,1fr); }
  .person-company-row > :last-child { grid-column: 2; }
  .bp-bar-val { display: none; }
}

/* Подсказки живого поиска (главная / лендинги) */
.bp-suggest-status { font-size: 10.5px; font-weight: 600; padding: 2px 8px; border-radius: 999px; flex-shrink: 0; white-space: nowrap; }
.bp-suggest-status.is-success { background: #DCFCE7; color: #15803D; }
.bp-suggest-status.is-danger  { background: #FEE2E2; color: #B91C1C; }
.bp-suggest-status.is-info    { background: #DBEAFE; color: #1D4ED8; }
.bp-suggest-status.is-warning { background: #FEF3C7; color: #B45309; }
.bp-suggest-status.is-neutral { background: #F1F5F9; color: #64748B; }

/* ══════════════════════════════════════════════════════════════
   DS 2026 — состояния API в языке главной (без рамок, мягкий фон)
   ══════════════════════════════════════════════════════════════ */
.api-skeleton,
.ui-skeleton {
  background: linear-gradient(90deg, #EEF2F7 0%, #F6F8FB 40%, #EEF2F7 80%);
  background-size: 800px 100%;
  border-radius: 8px !important;
}

/* ApiErrorState */
.api-error {
  display: flex; flex-direction: column; align-items: center; gap: 12px;
  padding: 40px 24px; text-align: center;
  color: #991B1B; background: #FEF2F2;
  border-radius: 16px !important;
}
.api-error.is-compact { flex-direction: row; text-align: left; gap: 12px; padding: 14px 16px; border-radius: 12px !important; }
.api-error-ico {
  flex: none; display: grid; place-items: center;
  width: 52px; height: 52px; color: #DC2626; background: #FFFFFF;
  border-radius: 14px !important;
}
.api-error.is-compact .api-error-ico { width: 36px; height: 36px; border-radius: 10px !important; }
.api-error-body { flex: 1; min-width: 0; }
.api-error-title { font: 800 18px/1.3 'Inter', -apple-system, system-ui, sans-serif; color: #7F1D1D; }
.api-error.is-compact .api-error-title { font-size: 14px; font-weight: 700; }
.api-error-msg { margin-top: 4px; font-size: 14px; line-height: 1.5; color: #B91C1C; word-break: break-word; }
.api-error .ds-btn, .api-error button { flex: none; }

/* FounderCoverageHint и другие подсказки */
.api-hint {
  display: flex; align-items: flex-start; gap: 12px;
  padding: 14px 16px;
  font-size: 14px; line-height: 1.55; color: #1E3A8A;
  background: #EFF6FF;
  border-radius: 12px !important;
}
.api-hint b { color: #1D4ED8; font-weight: 700; }
.api-hint-ico { flex: none; display: flex; margin-top: 2px; color: #2563EB; }

/* ─── Замок на платном блоке (LockedBlock, контракт 14.10) ─── */
.bp-locked { display:flex; align-items:center; gap:14px; padding:16px 18px;
  border:1px dashed var(--ink-300, #CBD5E1); border-radius:12px !important;
  background:var(--bg-subtle, rgba(148,163,184,.08)); color:var(--ink-700, #334155); }
.bp-locked-ico { flex:0 0 auto; width:36px; height:36px; display:grid; place-items:center;
  border-radius:50% !important; background:var(--bg-card, #fff); color:var(--ink-500, #64748B);
  border:1px solid var(--ink-200, #E2E8F0); }
.bp-locked-body { flex:1 1 auto; min-width:0; }
.bp-locked-title { font-weight:800; font-size:14px; color:var(--ink-900, #0F172A); margin-bottom:2px; }
.bp-locked-text { font-size:13.5px; line-height:1.45; color:var(--ink-600, #475569); }
.bp-locked-btn { flex:0 0 auto; white-space:nowrap; }
.bp-locked--inline { display:inline-flex; align-items:center; gap:6px; padding:0; border:0;
  background:none; font-size:13px; color:var(--ink-500, #64748B); }
.bp-locked--inline a { color:inherit; text-decoration:underline; text-underline-offset:2px; }
@media (max-width: 560px) {
  .bp-locked { flex-wrap:wrap; }
  .bp-locked-btn { width:100%; justify-content:center; }
}

/* ─── Тарифы в модалке (GET /api/auth/plans) ─── */
.bp-plans-top { margin-bottom: 18px; padding-right: 40px; }
.bp-plans-title { margin: 8px 0 0; }
.bp-plans-lead { margin: 8px 0 0; line-height: 1.5; }
.bp-plans-login { margin: 10px 0 0; font-size: 14px; color: var(--ink-500, #64748B); }
.bp-plans-login a { color: var(--ds-accent, #1D4ED8); font-weight: 600; }
.bp-plans { display: flex; flex-direction: column; gap: 12px; }
.bp-plan { display: flex; flex-direction: column; gap: 8px; padding: 16px 18px;
  background: var(--ds-bg, #F8FAFC); border-radius: 14px !important; }
.bp-plan.is-accent { background: var(--ds-accent-soft, #EFF6FF); box-shadow: inset 0 0 0 2px var(--ds-accent-3, #3B82F6); }
.bp-plan-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.bp-plan-name { font: 700 17px/1.3 var(--ds-font, inherit); color: var(--ink-900, #0F172A); }
.bp-plan-price { font: 700 20px/1.25 var(--ds-font, inherit); color: var(--ink-900, #0F172A); font-variant-numeric: tabular-nums; }
.bp-plan-year { font-size: 14px; font-weight: 500; color: var(--ink-500, #64748B); }
.bp-plan-features { list-style: none; margin: 2px 0 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.bp-plan-features li { display: flex; gap: 8px; font-size: 14px; line-height: 1.45; color: var(--ink-700, #334155); }
.bp-plan-check { flex: none; margin-top: 2px; color: #047857; display: flex; }
.bp-plan-btn { align-self: flex-start; margin-top: 4px; }
.bp-plan-skel { height: 120px; border-radius: 14px !important; }
.bp-plans-empty { padding: 16px; font-size: 14px; line-height: 1.5; color: var(--ink-600, #475569);
  background: var(--ds-bg, #F8FAFC); border-radius: 12px !important; }
.bp-plans-note { margin-top: 16px; font-size: 13px; color: var(--ink-500, #64748B); }
@media (max-width: 560px) { .bp-plan-btn { align-self: stretch; justify-content: center; } }

/* LockedBlock в узкой колонке: кнопка под текстом */
.bp-stack-lock .bp-locked { flex-wrap: wrap; }
.bp-stack-lock .bp-locked-body { flex-basis: calc(100% - 50px); }
.bp-stack-lock .bp-locked-btn { width: 100%; justify-content: center; }

/* Плашка «Данные из официальных источников» — вкладки с данными из API */
.source-banner {
  display: flex; gap: 10px; align-items: center; padding: 12px 16px; margin: 0 0 16px;
  background: var(--ds-ok-soft, #ECFDF5); color: #065F46;
  border: 0; border-radius: var(--ds-r, 12px) !important;
  font: 400 14px/1.5 var(--ds-font, Inter, system-ui, sans-serif);
}
.source-banner > svg { flex: none; color: #059669; }
.source-banner b { font-weight: 700; color: #064E3B; }
html[data-theme="dark"] .source-banner { background: rgba(16,185,129,.12); color: #A7F3D0; }
html[data-theme="dark"] .source-banner b { color: #D1FAE5; }
html[data-theme="dark"] .source-banner > svg { color: #34D399; }

/* ─── 26.10: единые уровни статуса, динамика, источники ─────── */
.bp-lv { display:inline-flex; align-items:center; gap:5px; }
.bp-lv-ico { flex-shrink:0; }
.bp-chg { display:inline-flex; align-items:center; gap:2px; font-size:12px; font-weight:600;
  font-variant-numeric:tabular-nums; white-space:nowrap; padding:1px 6px; border-radius:999px !important; }
.bp-chg--up   { color:var(--success-700,#047857); background:var(--success-50,#ECFDF5); }
.bp-chg--down { color:var(--danger-700,#B91C1C); background:var(--danger-50,#FEF2F2); }
.bp-chg--flat { color:var(--ink-600,#475569); background:var(--ink-100,#F1F5F9); }
.bp-src { display:inline; font-size:12px; line-height:1.5; color:var(--ink-500); }
.bp-src-k { color:var(--ink-400,var(--ink-500)); }
.bp-src a { color:var(--brand-700,#1D4ED8); text-decoration:none; }
.bp-src a:hover { text-decoration:underline; }
.bp-src-kind { display:inline-block; margin-right:4px; padding:0 5px; font-size:10px; font-weight:700;
  text-transform:uppercase; letter-spacing:.04em; line-height:16px; vertical-align:1px;
  border:1px solid var(--ink-200); color:var(--ink-600,#475569); background:var(--ink-50,#F8FAFC); }
.bp-src-kind--state    { color:#1E3A8A; border-color:#BFDBFE; background:#EFF6FF; }
.bp-src-kind--exchange { color:#6D28D9; border-color:#DDD6FE; background:#F5F3FF; }
.bp-src-kind--media    { color:#9A3412; border-color:#FED7AA; background:#FFF7ED; }
.bp-src-foot { margin-top:12px; padding-top:10px; border-top:1px dashed var(--ink-150,#EEF2F6); }

/* «Ключевая информация» и «Выводы» (правая колонка) */
.bp-ki { display:flex; flex-direction:column; }
.bp-ki-row { display:flex; gap:10px; align-items:flex-start; padding:9px 0; border-bottom:1px solid var(--ink-150); font-size:13px; line-height:1.45; }
.bp-ki-row:last-child { border-bottom:none; }
.bp-ki-ico { flex-shrink:0; width:22px; height:22px; display:inline-flex; align-items:center; justify-content:center;
  border-radius:999px !important; margin-top:-1px; }
.bp-ki-body { min-width:0; }
.bp-ki-l { color:var(--ink-500); font-size:12px; }
.bp-ki-v { color:var(--ink-900); overflow-wrap:anywhere; }
.bp-lvc--ok        { color:var(--success-700,#047857); background:var(--success-50,#ECFDF5); }
.bp-lvc--info      { color:var(--ink-600,#475569); background:var(--ink-100,#F1F5F9); }
.bp-lvc--attention { color:var(--warning-700,#B45309); background:var(--warning-50,#FFFBEB); }
.bp-lvc--risk      { color:var(--danger-700,#B91C1C); background:var(--danger-50,#FEF2F2); }
.bp-lvc--none      { color:var(--ink-400,#94A3B8); background:var(--ink-50,#F8FAFC); }
.bp-lvc--locked    { color:var(--ink-500); background:var(--ink-100,#F1F5F9); }
.bp-ki-row.is-none .bp-ki-v { color:var(--ink-500); }
.bp-ki-row.is-attention .bp-ki-v { color:var(--warning-700,#B45309); font-weight:600; }
.bp-ki-row.is-risk .bp-ki-v { color:var(--danger-700,#B91C1C); font-weight:600; }
.bp-ins { display:flex; flex-direction:column; gap:8px; }
.bp-ins-cap { font-size:11px; font-weight:600; text-transform:uppercase; letter-spacing:.06em; color:var(--ink-500); }
.bp-ins-row { display:flex; gap:8px; align-items:flex-start; font-size:13px; line-height:1.5; color:var(--ink-800,var(--ink-900)); }
.bp-ins-row .bp-ki-ico { width:20px; height:20px; }
.bp-ins-row.is-risk { color:var(--danger-700,#B91C1C); }
.bp-ins-row.is-attention { color:var(--warning-700,#B45309); }

/* ─── 26.10: виджет «Регионы» (regions-widget.jsx) ─────────── */
.rg-card { background:var(--bg-card,#fff); border:1px solid var(--ink-150,#EEF2F6); padding:24px; border-radius:12px !important; }
.rg-head { display:flex; justify-content:space-between; align-items:flex-start; gap:16px; flex-wrap:wrap; margin-bottom:16px; }
.rg-title { font-size:22px; font-weight:800; margin:0; color:var(--ink-900); }
.rg-sub { font-size:13px; color:var(--ink-500); margin-top:4px; line-height:1.5; }
.rg-years { display:flex; gap:4px; flex-wrap:wrap; }
.rg-year { border:1px solid var(--ink-200); background:transparent; color:var(--ink-700); font:600 13px Inter,sans-serif; padding:6px 12px; cursor:pointer; border-radius:999px !important; }
.rg-year.is-on { background:var(--brand-700,#1D4ED8); border-color:var(--brand-700,#1D4ED8); color:#fff; }
.rg-skel { display:flex; flex-direction:column; gap:8px; }
.rg-scroll { overflow-x:auto; transition:opacity .2s; }
.rg-scroll.is-loading { opacity:.5; }
.rg-table { width:100%; border-collapse:collapse; font-size:13.5px; min-width:720px; font-variant-numeric:tabular-nums; }
.rg-table th { text-align:left; font-size:11px; font-weight:600; text-transform:uppercase; letter-spacing:.05em; color:var(--ink-500); padding:8px 10px; border-bottom:1px solid var(--ink-200); vertical-align:bottom; }
.rg-table th small, .rg-table td small { display:block; font-size:11px; font-weight:400; text-transform:none; letter-spacing:0; color:var(--ink-500); margin-top:2px; }
.rg-table td { padding:10px; border-bottom:1px solid var(--ink-150); color:var(--ink-900); vertical-align:top; }
.rg-table tfoot td { font-weight:700; border-bottom:none; border-top:2px solid var(--ink-200); }
.rg-r { text-align:right !important; white-space:nowrap; }
.rg-n { width:32px; color:var(--ink-400) !important; }
.rg-reg { font-weight:600; }
.rg-tax { min-width:200px; }
.rg-tax-top { display:flex; justify-content:space-between; gap:8px; }
.rg-tax-top span { color:var(--ink-500); }
.rg-bar { height:6px; background:var(--ink-100,#F1F5F9); margin-top:6px; border-radius:999px !important; overflow:hidden; }
.rg-bar i { display:block; height:100%; background:var(--brand-600,#2563EB); border-radius:999px !important; }
.rg-table tr.is-none td { color:var(--ink-500); }
.rg-na { color:var(--ink-400); }
.rg-foot { margin-top:14px; font-size:12px; line-height:1.55; color:var(--ink-500); }
@media (max-width:767px) { .rg-card { padding:16px; } .rg-title { font-size:18px; } }