/*
 * Раздел «Закупки» (ELKO). Утилит Tailwind в панели нет — своя вёрстка на своих
 * классах, цвета из переменных темы Filament (они уже готовые oklch).
 */

.elko-link {
    color: var(--primary-600, #1c8437);
    text-decoration: underline;
    text-underline-offset: 2px;
}

.elko-muted {
    color: var(--gray-500, #6b7280);
}

.elko-steps {
    margin: 0 0 0.75rem;
    padding-left: 1.25rem;
    list-style: decimal;
    display: grid;
    gap: 0.35rem;
}

.elko-code,
.elko-json {
    margin: 0;
    padding: 0.75rem;
    border-radius: 0.5rem;
    overflow: auto;
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 0.8125rem;
    line-height: 1.45;
    white-space: pre-wrap;
    word-break: break-word;
    background: color-mix(in oklab, var(--gray-500, #6b7280) 8%, transparent);
}

.elko-json {
    max-height: 32rem;
}

/* Плитки показателей */
.elko-stats {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr));
    gap: 0.75rem;
}

.elko-stat {
    padding: 0.75rem 0.9rem;
    border: 1px solid var(--gray-200, #e5e7eb);
    border-radius: 0.75rem;
    min-width: 0;
}

.elko-stat__label {
    font-size: 0.75rem;
    color: var(--gray-500, #6b7280);
}

.elko-stat__value {
    margin-top: 0.15rem;
    font-size: 1.25rem;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    overflow-wrap: anywhere;
}

.elko-stat__hint {
    margin-top: 0.15rem;
    font-size: 0.75rem;
    color: var(--gray-500, #6b7280);
}

.elko-progress {
    height: 0.5rem;
    border-radius: 999px;
    overflow: hidden;
    background: var(--gray-200, #e5e7eb);
    margin-top: 0.75rem;
}

.elko-progress > span {
    display: block;
    height: 100%;
    background: var(--primary-500, #22a145);
    transition: width 0.4s ease;
}

/* Простые таблицы внутри секций */
.elko-table-wrap {
    overflow-x: auto;
}

.elko-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.875rem;
}

.elko-table th,
.elko-table td {
    padding: 0.45rem 0.6rem;
    border-bottom: 1px solid var(--gray-200, #e5e7eb);
    text-align: left;
    vertical-align: top;
}

.elko-table th {
    font-weight: 600;
    color: var(--gray-500, #6b7280);
    white-space: nowrap;
}

.elko-table .elko-num {
    text-align: right;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.elko-table tr.elko-group th {
    padding-top: 0.9rem;
    color: inherit;
    font-size: 0.8125rem;
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

/* Карточка товара */
.elko-product-head {
    display: grid;
    grid-template-columns: minmax(10rem, 18rem) minmax(0, 1fr);
    gap: 1.25rem;
    align-items: start;
}

@media (max-width: 48rem) {
    .elko-product-head {
        grid-template-columns: minmax(0, 1fr);
    }
}

.elko-product-image {
    border: 1px solid var(--gray-200, #e5e7eb);
    border-radius: 0.75rem;
    background: #fff;
    padding: 0.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    aspect-ratio: 1;
}

.elko-product-image img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.elko-gallery {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(8rem, 1fr));
    gap: 0.6rem;
}

.elko-gallery a {
    display: flex;
    align-items: center;
    justify-content: center;
    aspect-ratio: 1;
    padding: 0.35rem;
    border: 1px solid var(--gray-200, #e5e7eb);
    border-radius: 0.5rem;
    background: #fff;
    font-size: 0.75rem;
}

.elko-gallery img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.elko-description {
    line-height: 1.6;
    overflow-wrap: anywhere;
}

.elko-description p,
.elko-description ul,
.elko-description ol,
.elko-description table {
    margin: 0 0 0.6rem;
}

.elko-description ul {
    list-style: disc;
    padding-left: 1.25rem;
}

.elko-description ol {
    list-style: decimal;
    padding-left: 1.25rem;
}

.elko-description td,
.elko-description th {
    padding: 0.25rem 0.5rem;
    border: 1px solid var(--gray-200, #e5e7eb);
}

.elko-kits {
    display: grid;
    gap: 0.75rem;
}

.elko-kit {
    border: 1px solid var(--gray-200, #e5e7eb);
    border-radius: 0.75rem;
    padding: 0.75rem 0.9rem;
}

.elko-kit__head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
}

.elko-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}

.elko-tag {
    display: inline-flex;
    align-items: center;
    padding: 0.1rem 0.5rem;
    border-radius: 999px;
    font-size: 0.75rem;
    background: color-mix(in oklab, var(--gray-500, #6b7280) 12%, transparent);
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
}

.elko-stack {
    display: grid;
    gap: 1rem;
}

.elko-actions-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: 0.75rem;
}

.elko-tree-indent {
    display: inline-block;
    color: var(--gray-400, #9ca3af);
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    white-space: pre;
}

/* Сводный каталог поставщиков */
.sp-offers {
    display: grid;
    gap: 0.3rem;
    font-size: 0.8125rem;
}

.sp-offer {
    display: grid;
    grid-template-columns: 4.5rem minmax(7.5rem, max-content) minmax(0, 1fr);
    align-items: baseline;
    gap: 0.5rem;
    white-space: nowrap;
}

.sp-offer__stock {
    font-variant-numeric: tabular-nums;
}

.sp-offer__price {
    font-variant-numeric: tabular-nums;
}

.sp-offer--best .sp-offer__price {
    color: var(--success-600, #16a34a);
    font-weight: 600;
}

.sp-offer__stock--none {
    color: var(--danger-600, #dc2626);
}

/*
 * Полосы таблиц с ценами поставщиков («Товары сайта»). Штатные полосы
 * Filament — 5% белого в тёмной теме — на сильно отдалённом браузере не
 * видны, и строки с несколькими ценами сливались в одно полотно. Здесь
 * полосы и разделители заметнее, а строка под курсором подсвечивается,
 * чтобы вести взгляд от названия к ценам.
 */
.sp-offers-table .fi-ta-row {
    border-top: 1px solid var(--gray-200, #e5e7eb);
    transition: background-color 0.1s ease;
}

.sp-offers-table .fi-ta-row.fi-striped {
    background-color: var(--gray-100, #f3f4f6);
}

.sp-offers-table .fi-ta-row:hover {
    background-color: color-mix(in oklab, var(--primary-500, #22a145) 10%, transparent);
}

:is(.dark) .sp-offers-table .fi-ta-row {
    border-top-color: color-mix(in oklab, white 12%, transparent);
}

:is(.dark) .sp-offers-table .fi-ta-row.fi-striped {
    background-color: color-mix(in oklab, white 9%, transparent);
}

:is(.dark) .sp-offers-table .fi-ta-row:hover {
    background-color: color-mix(in oklab, var(--primary-500, #22a145) 16%, transparent);
}

.elko-table tr.sp-best td {
    background: color-mix(in oklab, var(--success-500, #22c55e) 10%, transparent);
}

.sp-suppliers {
    display: grid;
    gap: 1rem;
}

.sp-supplier__title {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.elko-preview--compact .elko-preview__stage {
    height: min(42vh, 26rem);
}

/* Фото товара крупно (окно по клику на миниатюру) */
.elko-zoomable {
    cursor: zoom-in;
}

.elko-preview {
    display: grid;
    gap: 0.75rem;
}

.elko-preview__stage {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    height: min(70vh, 44rem);
    padding: 0.75rem;
    border: 1px solid var(--gray-200, #e5e7eb);
    border-radius: 0.75rem;
    background: #fff;
}

.elko-preview__stage img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.elko-preview__nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.75rem;
    height: 2.75rem;
    border-radius: 999px;
    background: color-mix(in oklab, black 50%, transparent);
    color: #fff;
    font-size: 1.75rem;
    line-height: 1;
}

.elko-preview__nav:hover {
    background: color-mix(in oklab, black 70%, transparent);
}

.elko-preview__nav--prev {
    left: 0.75rem;
}

.elko-preview__nav--next {
    right: 0.75rem;
}

.elko-preview__strip {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.elko-preview__thumb {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 4.5rem;
    height: 4.5rem;
    padding: 0.25rem;
    border: 2px solid var(--gray-200, #e5e7eb);
    border-radius: 0.5rem;
    background: #fff;
}

.elko-preview__thumb img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.elko-preview__thumb.is-active {
    border-color: var(--primary-500, #22a145);
}

.elko-preview__footer {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem 1rem;
}

.elko-preview__links {
    display: flex;
    gap: 1rem;
}

:is(.dark) .elko-preview__stage,
:is(.dark) .elko-preview__thumb:not(.is-active) {
    border-color: color-mix(in oklab, white 10%, transparent);
}

:is(.dark) .elko-stat,
:is(.dark) .elko-table th,
:is(.dark) .elko-table td,
:is(.dark) .elko-kit,
:is(.dark) .elko-description td,
:is(.dark) .elko-description th {
    border-color: color-mix(in oklab, white 10%, transparent);
}

:is(.dark) .elko-progress {
    background: color-mix(in oklab, white 10%, transparent);
}

:is(.dark) .elko-product-image,
:is(.dark) .elko-gallery a {
    border-color: color-mix(in oklab, white 10%, transparent);
}

/* «Товары сайта и EAN» — окно подбора: кандидат из сводного каталога. */
.sp-candidate {
    border: 1px solid var(--gray-200);
    border-radius: 0.75rem;
    padding: 0.75rem 1rem;
}

:is(.dark) .sp-candidate {
    border-color: color-mix(in oklab, white 12%, transparent);
}

.sp-candidate__head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
}

.sp-candidate__ean {
    font-family: var(--mono-font-family, ui-monospace, monospace);
}

/* Единственная кнопка модального окна («Сформировать файл», «Сохранить»): на всю
   ширину и белым текстом — Filament у цветной кнопки в тёмной теме берёт тёмный. */
.fi-btn.fi-color.sp-modal-submit:not(.fi-outlined),
:is(.dark) .fi-btn.fi-color.sp-modal-submit:not(.fi-outlined) {
    width: 100%;
    color: #fff;
}

/* «Товары сайта и EAN»: у поставщика цена в его валюте и в рублях ПМР. */
.sp-offer.sp-offer--rup {
    grid-template-columns: 4.5rem minmax(6.5rem, max-content) minmax(7.5rem, max-content) minmax(0, 1fr);
}

.sp-offer__original {
    color: var(--gray-500);
    font-variant-numeric: tabular-nums;
}

/* История цен поставщиков в карточке товара. */
.sp-history__head {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.35rem;
}

.sp-history__up {
    color: var(--danger-600);
}

.sp-history__down {
    color: var(--success-600);
}

.elko-subtitle {
    font-weight: 600;
    font-size: 0.95rem;
}

/* Цена на локальном рынке в сводном каталоге. */
.sp-market__price {
    font-weight: 600;
    white-space: nowrap;
}

.sp-market__row {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 0.35rem;
    white-space: nowrap;
}

.sp-market__diff--up {
    color: var(--danger-600);
}

.sp-market__diff--down {
    color: var(--success-600);
}

.sp-market__stale {
    color: var(--warning-600);
}

/* Метка БУ рядом с остатком поставщика. */
.sp-offer__used {
    margin-left: 0.3rem;
    padding: 0 0.25rem;
    border-radius: 0.3rem;
    background-color: color-mix(in oklab, var(--warning-500, #f59e0b) 22%, transparent);
    color: var(--warning-600);
    font-size: 0.7rem;
    font-weight: 600;
}

/* История цен: переключатель «График / Таблица» и сам график. */
.sp-history__bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}

.sp-switch {
    display: inline-flex;
    padding: 0.15rem;
    border-radius: 0.5rem;
    background-color: color-mix(in oklab, var(--gray-500) 12%, transparent);
}

.sp-switch__btn {
    padding: 0.25rem 0.7rem;
    border-radius: 0.4rem;
    font-size: 0.8rem;
    font-weight: 500;
    color: var(--gray-500);
    cursor: pointer;
}

.sp-switch__btn--on {
    background-color: var(--gray-50, #fff);
    color: var(--gray-950, #111);
    box-shadow: 0 1px 2px rgb(0 0 0 / 0.08);
}

:is(.dark) .sp-switch__btn--on {
    background-color: var(--gray-700);
    color: var(--gray-50);
}

.sp-chart {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}

.sp-chart__legend {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
}

.sp-chart__chip {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.2rem 0.55rem;
    border: 1px solid color-mix(in oklab, var(--gray-500) 25%, transparent);
    border-radius: 0.5rem;
    font-size: 0.8rem;
    cursor: pointer;
}

/* Выключенный поставщик: остаётся читаемым, но видно, что он не на графике. */
.sp-chart__chip--off {
    opacity: 0.45;
    text-decoration: line-through;
}

.sp-chart__swatch {
    width: 0.7rem;
    height: 0.7rem;
    border-radius: 0.2rem;
}

.sp-chart__plot {
    position: relative;
    /* На широком мониторе растянутый на всю ширину график вырождается в плоские
       полосы — ограничиваем, чтобы соотношение сторон оставалось читаемым. */
    max-width: 68rem;
}

.sp-chart__svg {
    display: block;
    width: 100%;
    height: auto;
    /* Высота фиксирована, ширину даёт блок: единица графика — пиксель. */
    height: 16.25rem;
}

/* Подсказка по наведению: цены всех поставщиков на один момент. */
.sp-chart__tip {
    position: absolute;
    top: 0.5rem;
    z-index: 5;
    min-width: 11rem;
    padding: 0.45rem 0.6rem;
    border: 1px solid color-mix(in oklab, var(--gray-500) 25%, transparent);
    border-radius: 0.5rem;
    background-color: var(--gray-50, #fff);
    color: var(--gray-950, #111);
    box-shadow: 0 4px 12px rgb(0 0 0 / 0.12);
    font-size: 0.78rem;
    pointer-events: none;
    transform: translateX(0.75rem);
}

:is(.dark) .sp-chart__tip {
    background-color: var(--gray-800);
    color: var(--gray-50);
}

.sp-chart__tip--left {
    transform: translateX(calc(-100% - 0.75rem));
}

.sp-chart__tip-time {
    margin-bottom: 0.3rem;
    color: var(--gray-500);
}

.sp-chart__tip-row {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    line-height: 1.6;
}

.sp-chart__tip-row strong {
    margin-left: auto;
}

.sp-chart__grid {
    stroke: color-mix(in oklab, var(--gray-500) 25%, transparent);
    stroke-width: 1;
}

.sp-chart__label {
    fill: var(--gray-500);
    font-size: 0.7rem;
}

.sp-chart__line {
    fill: none;
    stroke-width: 2;
    stroke-linejoin: round;
    stroke-linecap: round;
}

.sp-chart__dot {
    stroke: var(--gray-50, #fff);
    stroke-width: 1.5;
}

:is(.dark) .sp-chart__dot {
    stroke: var(--gray-900);
}

.sp-chart__axis {
    fill: var(--gray-400);
    font-size: 0.65rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

/* Подпись у правого края линии: чья она и почём товар сейчас. */
.sp-chart__end {
    font-size: 0.72rem;
    font-weight: 600;
}

.sp-chart__cursor {
    stroke: color-mix(in oklab, var(--gray-500) 45%, transparent);
    stroke-width: 1;
    stroke-dasharray: 4 4;
}

.sp-chart__mark {
    stroke: var(--gray-50, #fff);
    stroke-width: 2;
}

:is(.dark) .sp-chart__mark {
    stroke: var(--gray-900);
}

/* Превью карточки товара под заказ перед публикацией на сайте. */
.sp-preorder {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.sp-preorder__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}

.sp-preorder__name {
    font-size: 1rem;
    font-weight: 600;
}

.sp-preorder__price {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.3rem;
}

.sp-preorder__value {
    font-size: 1.25rem;
    font-weight: 700;
}

.sp-preorder__images {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.sp-preorder__photo {
    width: 5rem;
    height: 5rem;
    object-fit: contain;
    padding: 0.25rem;
    border: 1px solid color-mix(in oklab, var(--gray-500) 22%, transparent);
    border-radius: 0.5rem;
    background-color: #fff;
}

.sp-preorder__photo--main {
    border-color: var(--primary-500);
}

.sp-preorder__description {
    margin: 0;
    line-height: 1.5;
}

/* Выбор фото в окне публикации: галочка рядом с самим снимком. */
.sp-preorder__thumb {
    width: 4.5rem;
    height: 4.5rem;
    object-fit: contain;
    padding: 0.2rem;
    border-radius: 0.4rem;
    background-color: #fff;
}

/* Мастер выгрузки товара под заказ: в подвале остаётся одна кнопка шага, и она
   занимает всю ширину окна. «Назад» на втором шаге держит свою ширину, чтобы
   главной оставалась публикация. */
/* От убранной «Отменить» остаётся пустой div: он забирал половину подвала, а
   потом отступ слева — убираем его совсем и растягиваем обёртки с кнопкой. */
.sp-preorder-modal .fi-sc-wizard-footer > *:not(:has(.fi-btn)) {
    display: none;
}

.sp-preorder-modal .fi-sc-wizard-footer > *:has(.fi-btn) {
    flex: 1 1 auto;
}

.sp-preorder-modal .fi-sc-wizard-footer > *:first-child {
    flex: 0 0 auto;
}

.sp-preorder-modal .fi-sc-wizard-footer .fi-btn {
    width: 100%;
}

/* Filament у цветной кнопки берёт тёмный текст — на зелёном он теряется. */
.sp-preorder-modal .fi-sc-wizard-footer .fi-btn.fi-color:not(.fi-outlined),
:is(.dark) .sp-preorder-modal .fi-sc-wizard-footer .fi-btn.fi-color:not(.fi-outlined) {
    color: #fff;
}

/* Выбор главного фото товара под заказ: ряд снимков, выбранный обведён. */
.sp-mainpick {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.sp-mainpick__item {
    position: relative;
    border: 2px solid var(--gray-200);
    border-radius: 0.5rem;
    padding: 0.15rem;
    background-color: #fff;
    cursor: pointer;
    transition: border-color 0.15s ease;
}

:is(.dark) .sp-mainpick__item {
    border-color: color-mix(in oklab, white 14%, transparent);
}

.sp-mainpick__item:hover {
    border-color: var(--primary-400);
}

.sp-mainpick__item--on {
    border-color: var(--primary-600);
}

.sp-mainpick__item img {
    width: 4.5rem;
    height: 4.5rem;
    object-fit: contain;
    border-radius: 0.35rem;
}

.sp-mainpick__flag {
    position: absolute;
    inset-inline: 0.15rem;
    bottom: 0.15rem;
    border-radius: 0.25rem;
    background-color: var(--primary-600);
    color: #fff;
    font-size: 0.6rem;
    line-height: 1.1rem;
    text-align: center;
}

/* Документы заказа в окне: по поставщику — бланк и таблица. */
.sp-docs__group {
    border: 1px solid var(--gray-200);
    border-radius: 0.6rem;
    padding: 0.75rem 0.9rem;
    margin-bottom: 0.6rem;
}

:is(.dark) .sp-docs__group {
    border-color: color-mix(in oklab, white 12%, transparent);
}

.sp-docs__supplier {
    font-weight: 600;
    margin-bottom: 0.5rem;
}

.sp-docs__meta {
    color: var(--gray-500);
    font-weight: 400;
    font-size: 0.8rem;
}

.sp-docs__files {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.sp-docs__file {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    border: 1px solid var(--gray-200);
    border-radius: 0.5rem;
    padding: 0.4rem 0.7rem;
    font-size: 0.85rem;
    text-decoration: none;
    color: inherit;
}

:is(.dark) .sp-docs__file {
    border-color: color-mix(in oklab, white 14%, transparent);
}

.sp-docs__file:hover {
    border-color: var(--primary-500);
}

.sp-docs__kind {
    font-weight: 700;
    font-size: 0.72rem;
    letter-spacing: 0.04em;
    color: var(--primary-600);
}

/* Снимок во весь экран: и в списке фото поставщиков, и в выборе главного. */
.sp-thumb {
    position: relative;
    display: inline-block;
}

.sp-thumb__zoom {
    position: absolute;
    top: 0.15rem;
    inset-inline-end: 0.15rem;
    width: 1.15rem;
    height: 1.15rem;
    line-height: 1.05rem;
    text-align: center;
    font-size: 0.7rem;
    border-radius: 0.3rem;
    border: 1px solid var(--gray-200);
    background-color: #fff;
    color: var(--gray-600);
    cursor: zoom-in;
    opacity: 0.85;
}

.sp-thumb__zoom:hover {
    opacity: 1;
    border-color: var(--primary-500);
    color: var(--primary-600);
}

.sp-mainpick__zoom {
    top: 0.25rem;
    inset-inline-end: 0.25rem;
}

.sp-preorder__photo {
    cursor: zoom-in;
}

.sp-zoom {
    position: fixed;
    inset: 0;
    /* Выше модального окна Filament, иначе снимок окажется под ним. */
    z-index: 999;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    padding: 2rem;
    background-color: rgb(0 0 0 / 0.78);
    cursor: zoom-out;
}

.sp-zoom__image {
    max-width: min(92vw, 1100px);
    max-height: 86vh;
    object-fit: contain;
    border-radius: 0.5rem;
    background-color: #fff;
}

.sp-zoom__hint {
    color: rgb(255 255 255 / 0.75);
    font-size: 0.8rem;
}

/*
 * Сводный каталог на сетке Tabulator (PurchasingOffersGrid). Тема самой сетки
 * общая с «Товарами» парсера (parser-table-rows.css), ячейки — общими классами
 * раздела (sp-offer, sp-market); здесь панель над сеткой и шапка.
 */
.sp-grid-categories {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.sp-grid-search {
    min-width: 20rem;
    padding: 0.5rem 0.75rem;
    border: 1px solid var(--gray-300, #d1d5db);
    border-radius: 0.5rem;
    background: transparent;
    color: inherit;
    font-size: 0.875rem;
}

:is(.dark) .sp-grid-search {
    border-color: color-mix(in oklab, white 15%, transparent);
}

.sp-grid-selection {
    color: var(--gray-500, #6b7280);
    font-size: 0.875rem;
}

/* Пришли к одному товару (?group=) или ищем товар из предзаказа — плашка над сеткой. */
.sp-grid-focus {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 0.75rem;
    padding: 0.65rem 0.9rem;
    border: 1px solid color-mix(in oklab, var(--primary-500, #22a145) 40%, transparent);
    border-radius: 0.6rem;
    background: color-mix(in oklab, var(--primary-500, #22a145) 8%, transparent);
    font-size: 0.875rem;
    line-height: 1.45;
}

.sp-grid-focus__icon {
    flex: none;
    width: 1.35rem;
    height: 1.35rem;
    color: var(--primary-600, #1c8437);
}

.sp-grid-focus__text {
    flex: 1;
    min-width: 0;
}

.sp-grid-focus__text strong {
    display: block;
}

.sp-grid-focus__inline-icon {
    display: inline-block;
    width: 1.05rem;
    height: 1.05rem;
    vertical-align: -0.2rem;
}

.sp-grid-focus__link {
    flex: none;
    font-weight: 600;
    color: var(--primary-600, #1c8437);
    white-space: nowrap;
}

.sp-grid-focus__link:hover {
    text-decoration: underline;
}

:is(.dark) .sp-grid-focus__icon,
:is(.dark) .sp-grid-focus__link {
    color: var(--primary-400, #4ade80);
}

@media (max-width: 640px) {
    .sp-grid-focus {
        flex-wrap: wrap;
    }
}

/* Прилипающая шапка, как в «Товарах»: с transform и overflow у корня сетки
   sticky прилипал бы к самой сетке, а не к окну. top — высота верхней панели Filament. */
#purchasing-offers-grid {
    min-height: 30rem;
    overflow: visible !important;
    transform: none !important;
}

#purchasing-offers-grid .tabulator-header {
    position: sticky !important;
    top: 4rem;
    z-index: 20;
}

.sp-grid-thumb {
    width: 44px;
    height: 44px;
    object-fit: contain;
    border-radius: 0.375rem;
    background: #fff;
}

.sp-grid-copy {
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    cursor: copy;
}

/* Ячейка с vertAlign у Tabulator — flex-строка: обёртка занимает всю ширину. */
.sp-grid-cell {
    flex: 1 1 auto;
    min-width: 0;
}

.sp-grid-name {
    font-weight: 500;
}

.sp-grid-sub {
    margin-top: 0.15rem;
    color: var(--gray-500, #6b7280);
    font-size: 0.8125rem;
}

/* Продавец в «Цене у конкурентов» — ссылка на его страницу товара. */
.sp-grid-market-link {
    display: inline-flex;
    border-radius: 0.375rem;
}

.sp-grid-market-link:hover .fi-badge {
    box-shadow: 0 0 0 1px var(--primary-500, #22a145);
}