/* Ценник AI-кредитов (SCRUM-641, 14.10.2026): таблица действий, список бесплатного, кредиты
   тарифов, отдельный счёт картинок и счетов.

   ОДИН ФАЙЛ НА ДВЕ СТОРОНЫ - страницу `/pricing/credits/` и Settings -> Usage: печатник у них один
   (`template-parts/plans/credit-prices.php`), и второй копии правил завести было бы некуда, кроме
   второго хозяина. Таблица одета как строки Usage (`.sc-use`): рамка-волосок, скругление, строки
   через волосок.

   Переменных файл не объявляет: значения - из токенов. Ширину решает контейнер, а не окно. */

.sc-cp{border:1px solid var(--sc-hairline);border-radius:var(--sc-radius-sm);overflow:hidden;background:var(--sc-surface)}
.sc-cp__t{inline-size:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
.sc-cp__t th,.sc-cp__t td{padding:var(--sc-space-12) var(--sc-space-16);text-align:start;vertical-align:top;font-weight:inherit}
.sc-cp__t thead th{color:var(--sc-text-muted);font-size:var(--sc-text-caption);font-weight:var(--sc-fw-medium)}
.sc-cp__t tbody th,.sc-cp__t tbody td{border-block-start:1px solid var(--sc-hairline)}
.sc-cp__what{display:block;color:var(--sc-ink-900);font-weight:var(--sc-fw-medium)}
.sc-cp__unit{display:block;margin-block-start:var(--sc-space-4);color:var(--sc-text-muted);font-size:var(--sc-text-caption);font-weight:var(--sc-fw-text)}
.sc-cp__t .sc-cp__n{text-align:end;white-space:nowrap;color:var(--sc-ink-900)}
.sc-cp__t tbody .sc-cp__n{font-weight:var(--sc-fw-medium)}
.sc-cp__t thead .sc-cp__n{color:var(--sc-text-muted)}

/* Что бесплатно: галочка и строка, как список «включено» у страницы цен. */
.sc-cp-free{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:var(--sc-space-12)}
.sc-cp-free li{display:flex;align-items:flex-start;gap:var(--sc-space-12)}
.sc-cp-free .sc-icon{flex:none;font-size:20px;color:var(--sc-success)}

/* Кредиты в тарифах: карточка на тариф, на узком - столбиком. */
.sc-cp-plans{margin:0;padding:0;list-style:none;display:grid;grid-template-columns:minmax(0,1fr);gap:var(--sc-space-12)}
.sc-cp-plans li{display:flex;flex-direction:column;gap:var(--sc-space-4);padding:var(--sc-space-16);
  border:1px solid var(--sc-hairline);border-radius:var(--sc-radius-sm);background:var(--sc-surface)}
.sc-cp-plans p{margin:0}
.sc-cp-plans__name{color:var(--sc-ink-900);font-weight:var(--sc-fw-medium)}
.sc-cp-plans__n{color:var(--sc-ink-900);font-variant-numeric:tabular-nums}
.sc-cp-plans__buys{color:var(--sc-text-muted);font-size:var(--sc-text-caption)}
@container (min-width:900px){.sc-cp-plans{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* Отдельный счёт: карточка вида, под ней три ячейки тарифов. */
.sc-cp-sep{margin:0;padding:0;list-style:none;border:1px solid var(--sc-hairline);border-radius:var(--sc-radius-sm);background:var(--sc-surface)}
.sc-cp-sep li{padding:var(--sc-space-12) var(--sc-space-16)}
.sc-cp-sep li + li{border-block-start:1px solid var(--sc-hairline)}
.sc-cp-sep p{margin:0}
.sc-cp-sep__caps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--sc-space-8);margin:var(--sc-space-12) 0 0}
.sc-cp-sep__caps div{min-inline-size:0}
.sc-cp-sep__caps dt{color:var(--sc-text-muted);font-size:var(--sc-text-caption)}
.sc-cp-sep__caps dd{margin:0;color:var(--sc-ink-900);font-weight:var(--sc-fw-medium);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}

.sc-cpp__note{color:var(--sc-text-muted);font-size:var(--sc-text-caption)}

/* Usage: ценник свёрнут под одной строкой - журнал расхода не уезжает вниз на одиннадцать строк. */
.sc-cp-fold{border:1px solid var(--sc-hairline);border-radius:var(--sc-radius-sm);background:var(--sc-surface)}
.sc-cp-fold__btn{display:flex;align-items:center;justify-content:space-between;gap:var(--sc-space-12);
  padding:var(--sc-space-12) var(--sc-space-16);list-style:none;cursor:pointer;color:var(--sc-ink-900);font-weight:var(--sc-fw-medium)}
.sc-cp-fold__btn::-webkit-details-marker{display:none}
.sc-cp-fold__btn .sc-icon{flex:none;font-size:18px;color:var(--sc-text-muted);transition:transform var(--sc-dur-fast)}
.sc-cp-fold[open] .sc-cp-fold__btn .sc-icon{transform:rotate(180deg)}
.sc-cp-fold .sc-cp{border:0;border-block-start:1px solid var(--sc-hairline);border-radius:0}
.sc-cp-fold__more{display:flex;align-items:center;gap:var(--sc-space-8);margin:0;padding:var(--sc-space-12) var(--sc-space-16);
  border-block-start:1px solid var(--sc-hairline);color:var(--sc-text-muted);font-size:var(--sc-text-caption)}
.sc-cp-fold__more a{color:var(--sc-ink-900);text-decoration:underline;text-underline-offset:3px}

@media (prefers-reduced-motion:reduce){.sc-cp-fold__btn .sc-icon{transition:none}}
html.atx-rm .sc-cp-fold__btn .sc-icon{transition:none}