/* OCMarket: комплекты разработок. Author: Stas-Clear.
   Цвета и размеры — из системы карточки OCMarket (--ocm-*), с запасными значениями для Modern. Минимум текста 12 px. */
.ocm-bundle,
.ocm-bundle-buy,
.ocm-bundle-field {
    --ocmb-primary: var(--ocm-primary, #3867d6);
    --ocmb-primary-dark: var(--ocm-primary-dark, #264ea8);
    --ocmb-soft: var(--ocm-primary-soft, #edf3ff);
    --ocmb-ink: var(--ocm-ink, #1d2939);
    --ocmb-muted: var(--ocm-muted, #667085);
    --ocmb-line: var(--ocm-line, #e4e9f1);
    --ocmb-sale: #e5484d;
    --ocmb-ok: #16a34a;
}

/* ---------- Блок комплекта на странице разработки ----------
   Часть панели покупки: отделён линией, без своей заливки и «бейджей»;
   цена — та же разметка, что у основной цены (ocm-price), кнопка — как «Пакеты для скачивания». */
.ocm-bundle {
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px solid #edf0f5;
    color: var(--ocmb-ink);
}
.ocm-bundle-card .ocm-bundle:first-child { margin-top: 0; padding-top: 0; border-top: 0; }
.ocm-bundle__title {
    margin: 0;
    color: var(--ocmb-ink);
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.3;
}
.ocm-bundle__percent { color: #15803d; }
.ocm-bundle__lead {
    margin: 2px 0 10px;
    color: var(--ocmb-muted);
    font-size: .8125rem;
    line-height: 1.4;
}
.ocm-bundle__list { margin: 0 0 12px; padding: 0; list-style: none; }
.ocm-bundle__item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 5px 0;
    font-size: .875rem;
    line-height: 1.3;
}
.ocm-bundle__icon {
    display: inline-flex;
    flex: 0 0 auto;
    width: 32px;
    height: 32px;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border-radius: 8px;
    background: #f1f3f6;
}
.ocm-bundle__icon img { width: 100%; height: 100%; object-fit: cover; }
.ocm-bundle__letter { color: #667085; font-size: .875rem; font-weight: 700; line-height: 1; }
.ocm-bundle__name { flex: 1 1 auto; min-width: 0; overflow-wrap: anywhere; }
.ocm-bundle__name a { color: var(--ocmb-ink); }
.ocm-bundle__name a:hover { color: var(--ocmb-primary); }
.ocm-bundle__item.is-current .ocm-bundle__name { font-weight: 600; }
.ocm-bundle__here { color: var(--ocmb-muted); font-size: .75rem; font-weight: 400; white-space: nowrap; }
.ocm-bundle__price { flex: 0 0 auto; color: var(--ocmb-muted); white-space: nowrap; }
.ocm-bundle__owned { flex: 0 0 auto; color: var(--ocmb-ok); font-size: .8125rem; white-space: nowrap; }
.ocm-bundle__total {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: 4px 12px;
    margin: 0 0 12px;
    padding-top: 10px;
    border-top: 1px dashed #e4e9f1;
}
.ocm-bundle__total-label { color: var(--ocmb-muted); font-size: .875rem; }
.ocm-bundle__total .ocm-price__current { font-size: 1.25rem; line-height: 1.2; }
/* Как кнопки самой панели покупки (.ocm-buy-panel > .btn): текст по центру при её min-height. */
.ocm-bundle .btn { display: flex; align-items: center; justify-content: center; line-height: 1.2; }
.ocm-bundle__note { margin: 0 0 10px; color: var(--ocmb-muted); font-size: .8125rem; line-height: 1.45; }
.ocm-bundle__note.is-done { color: var(--ocmb-ok); }
.ocm-bundle__terms { margin: 8px 0 0; color: var(--ocmb-muted); font-size: .75rem; line-height: 1.45; }
.ocm-bundle__terms a { color: inherit; text-decoration: underline; }
.ocm-bundle__terms a:hover { color: var(--ocmb-primary); }

/* Общие элементы страницы покупки */
.ocm-bundle-buy .ocm-bundle__icon { width: 40px; height: 40px; border-radius: 10px; }
.ocm-bundle-buy .ocm-bundle__owned { font-size: .8125rem; }
.ocm-bundle__summary { margin: 0 0 14px; }
.ocm-bundle__line {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 10px;
    padding: 4px 0;
    color: var(--ocmb-muted);
    font-size: .875rem;
}
.ocm-bundle__line.is-total { margin-top: 4px; padding-top: 10px; border-top: 1px solid #edf0f5; color: var(--ocmb-ink); font-weight: 600; }
.ocm-bundle__line.is-total .ocm-price__current { font-size: 1.375rem; line-height: 1.2; }

/* ---------- Страница покупки комплекта (штатные card Modern) ---------- */
.ocm-bundle-buy { color: var(--ocmb-ink); }
.ocm-bundle-buy__lead { margin: 0 0 8px; color: var(--ocmb-muted); font-size: .875rem; line-height: 1.5; }
.ocm-bundle-buy__items { margin: 0; padding: 0; list-style: none; }
.ocm-bundle-buy__item { display: flex; align-items: center; gap: 12px; padding: 10px 0; }
.ocm-bundle-buy__item + .ocm-bundle-buy__item { border-top: 1px solid #edf0f5; }
.ocm-bundle-buy__info { flex: 1 1 auto; min-width: 0; line-height: 1.35; }
.ocm-bundle-buy__info a { color: var(--ocmb-ink); }
.ocm-bundle-buy__info small { display: block; color: var(--ocmb-muted); font-size: .75rem; }
.ocm-bundle-buy__price { flex: 0 0 auto; text-align: right; line-height: 1.3; white-space: nowrap; }
.ocm-bundle-buy__price del { display: block; color: var(--ocmb-muted); font-size: .75rem; }
.ocm-bundle-buy__balance { display: flex; justify-content: space-between; margin: 0 0 14px; color: var(--ocmb-muted); font-size: .875rem; }
.ocm-bundle-buy__balance b { color: var(--ocmb-ink); font-weight: 600; }
.ocm-bundle-buy__terms { margin: 12px 0 0; color: var(--ocmb-muted); font-size: .75rem; line-height: 1.5; }
@media (min-width: 992px) { .ocm-bundle-buy__summary { position: sticky; top: 90px; } }

/* ---------- Поле «Комплект» в форме ---------- */
.ocm-bundle-field__head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 8px;
}
.ocm-bundle-field__head label { margin: 0; }
.ocm-bundle-field__counter { color: var(--ocmb-muted); font-size: .8125rem; white-space: nowrap; }
.ocm-bundle-field__items { margin-bottom: 10px; }
.ocm-bundle-field__item { display: flex; align-items: center; gap: 12px; padding: 10px 12px; }
.ocm-bundle-field__thumb {
    display: inline-flex;
    flex: 0 0 auto;
    width: 40px;
    height: 40px;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border-radius: 10px;
    background: var(--ocmb-soft);
    box-shadow: 0 0 0 1px rgba(29, 41, 57, .06);
}
.ocm-bundle-field__thumb img { width: 100%; height: 100%; object-fit: cover; }
.ocm-bundle-field__thumb .ocm-bundle__letter { font-size: 1rem; }
.ocm-bundle-field__info { flex: 1 1 auto; min-width: 0; line-height: 1.3; }
.ocm-bundle-field__title { display: -webkit-box; overflow: hidden; font-weight: 600; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow-wrap: anywhere; }
.ocm-bundle-field__meta { color: var(--ocmb-muted); font-size: .8125rem; }
.ocm-bundle-field__actions { display: flex; flex: 0 0 auto; gap: 4px; }
.ocm-bundle-field__actions .btn { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; padding: 0; }
.ocm-bundle-field__item:first-child .ocm-bundle-field__up,
.ocm-bundle-field__item:last-child .ocm-bundle-field__down { opacity: .35; pointer-events: none; }
.ocm-bundle-field__empty {
    margin-bottom: 10px;
    padding: 16px;
    border: 1px dashed #c9d4e5;
    border-radius: .25rem;
    color: var(--ocmb-muted);
    font-size: .875rem;
    text-align: center;
}
.ocm-bundle-field__picker { margin-top: 10px; padding: 10px; }
.ocm-bundle-field__results { max-height: 320px; margin-top: 8px; overflow-y: auto; }
.ocm-bundle-field__result { display: flex; align-items: center; gap: 10px; padding: 8px 10px; cursor: pointer; }
.ocm-bundle-field__result .ocm-bundle-field__thumb { width: 32px; height: 32px; border-radius: 8px; }
.ocm-bundle-field__result-add { flex: 0 0 auto; color: var(--ocmb-primary); font-size: .8125rem; font-weight: 700; white-space: nowrap; }
.ocm-bundle-field__pricing { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px; margin-top: 16px; }
.ocm-bundle-field__discount-group { flex: 0 1 220px; min-width: 160px; margin: 0; }
.ocm-bundle-field__summary {
    flex: 1 1 260px;
    min-height: calc(1.5em + .75rem + 2px);
    padding: .375rem .75rem;
    border-radius: .25rem;
    background: #f8f9fb;
    color: var(--ocmb-muted);
    font-size: .875rem;
    line-height: 1.5;
}
.ocm-bundle-field__summary b { color: var(--ocmb-ink); }
.ocm-bundle-field__summary .is-sale { color: var(--ocmb-sale); }
.ocm-bundle-field__summary.is-error { background: #fff4f4; color: #b42318; }
