/* НОВЫЙ ВИД КАРТОЧКИ ДЕКЛАРАЦИИ (#1395, макет «Экраны платформы v2»,
   экран 2: ПК, планшет, телефон). Шаблон — `templates/v2/card.html`,
   общие детали обеих карточек (токены, плитки, таблица, кнопки) — в
   `kartochki.css`; здесь только своё, с приставкой `nvd-`.

   ВСЁ ВНУТРИ `.nv-kartochka`: оболочку `base.html` и соседние страницы
   этот файл не трогает. Узкий экран — первым, шире — media-блоками
   ниже (640 и 1080, как в общем файле); пар `sm:`/`shell:` нет. */

/* ── НАВИГАЦИЯ: «← Предыдущая / Следующая →» справа ── */
.nv-kartochka .nvd-listanie { display: inline-flex; flex-wrap: wrap; gap: 8px; }

/* ── ШАПКА ──
   На телефоне — карточка (как в макете телефона: метка, H1, номер,
   строка «дата · у нас · просмотры» в белой рамке); с планшета — без
   рамки, прямо на фоне страницы. */
.nv-kartochka .nvd-shapka {
  padding: 14px;
  border: 1px solid var(--nv-lilac);
  border-radius: 16px;
  background: var(--nv-card);
}
.nv-kartochka .nvd-h1 { margin-top: 8px; overflow-wrap: anywhere; }
/* Номер декларации под заголовком: длинные номера старого образца
   («ЕАЭС N RU Д-RU.РА01.В.12345/26») не должны распирать экран. */
.nv-kartochka .nvd-h1 .nv-pripiska {
  display: block;
  max-width: 100%;
  margin-top: 4px;
  overflow-wrap: anywhere;
}
.nv-kartochka .nvd-nomer { margin-top: 4px; overflow-wrap: anywhere; }
.nv-kartochka .nvd-produkciya {
  margin: 6px 0 0;
  font-size: 12.5px;
  line-height: 1.45;
  color: var(--nv-charcoal);
  overflow-wrap: anywhere;
}
.nv-kartochka .nvd-stroka { margin-top: 6px; }
.nv-kartochka .nvd-svezho { color: var(--nv-ok-fg); font-weight: 600; }
.nv-kartochka .nvd-otvet { margin-top: 10px; font-size: 13px; line-height: 1.5; }
.nv-kartochka .nvd-shapka .nv-deystviya { width: 100%; }
/* Звезда и «Поделиться» — как кнопки-контур макета: 40 × 47, без
   заливки (на телефоне под ними белая шапка, с планшета — фон страницы). */
.nv-kartochka .nvd-shapka .nv-deystviya [data-fav],
.nv-kartochka .nvd-shapka .nv-deystviya [data-share] { width: 47px; background: transparent; }
.nv-kartochka .nvd-shapka .nv-deystviya [data-share] { display: inline-flex; align-items: center; justify-content: center; }
.nv-kartochka .nvd-shapka .nv-deystviya [data-fav][aria-pressed="true"],
.nv-kartochka .nvd-shapka .nv-deystviya [data-fav]:hover,
.nv-kartochka .nvd-shapka .nv-deystviya [data-share]:hover { background: var(--nv-wash); }
.nv-kartochka .nvd-shapka .nv-deystviya form { flex: 1 1 auto; }
.nv-kartochka .nvd-shapka .nv-deystviya form .nv-knopka { width: 100%; }

/* ── ПЛИТКИ ── */
.nv-kartochka .nvd-syroe { overflow-wrap: anywhere; }
.nv-kartochka .nvd-tiho { color: var(--nv-mid); }
/* На телефоне плитка ~150 px: «Производитель» шрифтом 17 px в неё не
   входит и рвётся посреди слова — значение мельче. */
@media (max-width: 639.98px) {
  .nvd .nv-plitka-znachenie { font-size: 14px; overflow-wrap: break-word; }
}
/* В кадре телефона макета плиток нет (#1454): размер, срок и «Кто
   продаёт» тут же идут строками «Партии», активность — в блоке ФГИС. */
@media (max-width: 639.98px) {
  .nvd .nv-plitki { display: none; }
}

/* Колонки «Партия» и «О компании» — равной высоты, как в макете (#1454,
   владелец 14.10.2026: «на макете промежутки между блоками равные»):
   «Партия» тянется до низа правой колонки, следующий блок начинается
   через тот же зазор под обеими. */
.nvd .nv-dve { align-items: stretch; }
/* Левая колонка бывает выше правой (сорт, ГОСТ, ОКПД2, цена) — тогда
   тянется последняя карточка правой, и обе кончаются на одной линии. */
.nvd .nv-stolbec > :last-child { flex-grow: 1; }

/* Светлые плитки — с отступом 14 со всех сторон, как карточки макета
   (у тёмной — 12/14, как у плитки макета). */
.nvd .nv-plitka { padding: 14px; }

/* ── РАЗДЕЛЫ ── */
.nv-kartochka .nvd-chipy { display: inline-flex; margin-left: 6px; vertical-align: 1px; }
.nv-kartochka .nvd-daty { margin-top: 6px; font-size: 12px; color: var(--nv-charcoal); }
.nv-kartochka .nvd-kody { margin-top: 10px; overflow-wrap: anywhere; }
.nv-kartochka .nvd-pod-h2 { margin-top: 4px; }
.nv-kartochka .nvd-fgis-zam { margin-top: 8px; }
/* Шапка ФГИС: заголовок слева, серая метка «само, по ИНН» справа (макет). */
.nv-kartochka .nvd-fgis-shapka { align-items: center; gap: 8px; }
.nv-kartochka .nvd-fgis .nv-razdel-telo { margin-top: 8px; }
.nv-kartochka .nvd-da { color: var(--nv-ok-fg); font-weight: 700; }
/* Статус словом, как в макете: «Действует» жирным зелёным, «Прекращена» —
   красным; плашки остаются только у метки в шапке. */
.nv-kartochka .nvd-st { font-weight: 700; }
.nv-kartochka .nvd-st-ok { color: var(--nv-ok-fg); }
.nv-kartochka .nvd-st-warn { color: var(--nv-warn-fg); }
.nv-kartochka .nvd-st-bad { color: var(--nv-bad-fg); }
.nv-kartochka .nvd-st-off { color: var(--nv-mid); }
.nv-kartochka .nvd-ssylka { color: var(--nv-plum); font-weight: 600; text-decoration: none; }
.nv-kartochka .nvd-ssylka:hover { color: var(--nv-plum-hover); text-decoration: underline; }

/* Телефоны и почты стороны: по строке на контакт, подписи — чипами. */
.nv-kartochka .nvd-kontakty { display: flex; flex-direction: column; gap: 4px; }
.nv-kartochka .nvd-kontakty > div { overflow-wrap: anywhere; }
.nv-kartochka .nvd-pochta { word-break: break-all; }
.nv-kartochka .nvd-pometka {
  display: inline-block;
  margin-left: 6px;
  padding: 1px 6px;
  border-radius: 4px;
  background: var(--nv-fog);
  font-family: var(--nv-ui);
  font-size: 10.5px;
  font-weight: 600;
  line-height: 1.5;
  color: var(--nv-mid);
  vertical-align: 1px;
  white-space: nowrap;
  word-break: normal;
}
.nv-kartochka .nvd-pometka-warn { background: var(--nv-warn-bg); color: var(--nv-warn-fg); }
.nv-kartochka .nvd-poyasnenie {
  margin: 8px 0 0;
  padding: 8px 10px;
  border-radius: 4px;
  background: var(--nv-warn-bg);
  font-size: 12px;
  line-height: 1.45;
  color: var(--nv-warn-fg);
}

/* ── ЗАМОК КОНТАКТОВ ──
   Маска (точки — не из настоящего номера) и под ней плашка с тем, что
   делать дальше; форма входа гостя встаёт сюда же. */
.nv-kartochka .nvd-zamok { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.nv-kartochka .nvd-maska {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--nv-carbon);
  letter-spacing: .04em;
  user-select: none;
}
/* Замок — серым, как в макете (цвет в разметке — запасной). */
.nv-kartochka .nvd-maska svg { flex: none; stroke: var(--nv-mid); }
.nv-kartochka .nvd-zamok-blok {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
  margin-top: 4px;
  padding: 12px 14px;
  border-radius: 4px;
  background: var(--nv-wash);
  font-size: 12.5px;
  line-height: 1.45;
  color: var(--nv-charcoal);
}
.nv-kartochka .nvd-zamok-tekst { flex: 1 1 220px; min-width: 0; }
.nv-kartochka .nvd-zamok-dop { flex-basis: 100%; }
.nv-kartochka .nvd-zamok-vhod { flex: 1 1 100%; min-width: 0; }
.nv-kartochka .nvd-zamok-vhod .nvd-zamok-tekst { display: block; margin-bottom: 8px; }

/* Заметка о контрагенте (макрос ui.zametka_karty, общий со светлым видом):
   рамка, угол и отступ — как у разделов карточки, заголовок — шрифтом
   заголовков разделов. Только внутри `.nvd-zametka` — макрос не трогаем. */
.nv-kartochka .nvd-zametka { min-width: 0; }
.nv-kartochka .nvd-zametka > div {
  padding: 14px;
  border: 1px solid var(--nv-lilac);
  border-radius: 16px;
  background: var(--nv-card);
}
.nv-kartochka .nvd-zametka h2 {
  font-family: var(--nv-display);
  font-size: 16px;
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: -.008em;
  color: var(--nv-carbon);
}

/* ── ДРУГИЕ ДЕКЛАРАЦИИ ПОСТАВЩИКА ── */
/* Справа в шапке — число строк простым серым текстом и «Все в ленте →». */
.nv-kartochka .nvd-istoriya-sprava { display: inline-flex; align-items: baseline; gap: 12px; }
.nv-kartochka .nvd-schyot { font-size: 12.5px; }
/* Цена и статус продавца у строки (экран 6 макета): под названием. */
.nv-kartochka .nvd-h-cena {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 6px;
  margin-top: 6px;
  font-size: 12px;
  color: var(--nv-mid);
}
.nv-kartochka .nvd-h-cena-chislo { font-size: 14px; color: var(--nv-plum); }
.nv-kartochka .nvd-h-cena .nv-metka { font-size: 10.5px; padding: 2px 6px; }
.nv-kartochka .nvd-istoriya { margin-top: 10px; }
.nv-kartochka .nvd-ed { font-size: 12px; color: var(--nv-mid); }
.nv-kartochka .nvd-h-podpis { color: var(--nv-mid); }
.nv-kartochka .nvd-istoriya .nvd-h-prod a { overflow-wrap: anywhere; font-weight: 400; }

/* Телефон: строка — карточка без прокрутки вбок. Первая строчка — дата
   и статус, вторая — продукция, третья — схема и тоннаж. Шапка таблицы
   не нужна: подпись «Схема» стоит у значения. */
@media (max-width: 639.98px) {
  .nv-kartochka .nvd-istoriya { overflow: hidden; border: 0; border-radius: 0; background: transparent; }
  .nv-kartochka .nvd-istoriya .nv-tablica,
  .nv-kartochka .nvd-istoriya tbody { display: block; }
  .nv-kartochka .nvd-istoriya thead { display: none; }
  .nv-kartochka .nvd-istoriya tr {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas:
      "data status"
      "prod prod"
      "shema tonn";
    gap: 4px 12px;
    /* Строки списка внутри одной карточки, через черту — как .str макета
       (#1454), а не карточка в карточке. */
    margin-top: 0;
    padding: 10px 0;
    border: 0;
    border-top: 1px solid var(--nv-fog);
    border-radius: 0;
    background: transparent;
  }
  .nv-kartochka .nvd-istoriya tr:first-child { border-top: 0; padding-top: 0; }
  .nv-kartochka .nvd-istoriya td { display: block; padding: 0; border: 0; min-width: 0; }
  .nv-kartochka .nvd-istoriya tbody tr:last-child td { border: 0; }
  .nv-kartochka .nvd-h-data { grid-area: data; font-size: 12px; color: var(--nv-mid); align-self: center; }
  .nv-kartochka .nvd-h-status { grid-area: status; justify-self: end; align-self: center; }
  .nv-kartochka .nvd-h-prod { grid-area: prod; }
  .nv-kartochka .nvd-istoriya .nvd-h-prod a { font-weight: 600; }
  .nv-kartochka .nvd-h-shema { grid-area: shema; align-self: end; font-size: 12px; }
  .nv-kartochka .nvd-h-tonn { grid-area: tonn; justify-self: end; align-self: end; }
}
@media (min-width: 640px) {
  /* Подпись и «т» — только на телефоне: с планшета их несёт шапка
     таблицы («Схема», «Тоннаж»). */
  .nv-kartochka .nvd-h-podpis,
  .nv-kartochka .nvd-ed { display: none; }
}

/* Сноска о цене продавца — отдельным абзацем под блоками (макет e6). */
.nv-kartochka .nvd-cena-snoska { padding: 0 2px; }

/* ── СТРОКА «ПОСТАВЩИКИ ЭТОЙ КУЛЬТУРЫ» ── */
.nv-kartochka .nvd-listingi { padding: 0 2px; }
/* Ссылки строки — обычной насыщенности, как в макете (kartochki.css
   делает их жирными для всех карточек — его не трогаем). */
.nv-kartochka .nvd-listingi a:not([class]) { font-weight: 400; }

/* ── ЦЕНА ПРОДАВЦА (#1354) — тёмный вид владельца ──
   Число — крупно и цветом сливы (как в макете), статус — меткой;
   «не продаётся» — серой, без цены. */
.nv-kartochka .nvd-cena { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; }
.nv-kartochka .nvd-cena-chislo { font-size: 17px; color: var(--nv-plum); }
.nv-kartochka .nvd-metka-net { background: var(--nv-fog); color: var(--nv-mid); }
.nv-kartochka .nvd-cena-blok {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--nv-fog);
}
.nv-kartochka .nvd-cena-vopros { margin: 0; font-size: 13px; color: var(--nv-charcoal); }
.nv-kartochka .nvd-cena-vopros b { color: var(--nv-carbon); }

/* ── «ПРОВЕРИТЬ КОНКРЕТНУЮ ПАРТИЮ ИЛИ ДОКУМЕНТ» (#1353, #1355) ──
   Свёрнутый блок; три формы — столбиком, на ПК — в три колонки с
   чертой между ними. Ответ сервера — строкой проверки `.nv-prov`. */
.nv-kartochka .nvd-proverka > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  cursor: pointer;
  list-style: none;
}
.nv-kartochka .nvd-proverka > summary::-webkit-details-marker { display: none; }
.nv-kartochka .nvd-proverka-zag { display: flex; flex-direction: column; min-width: 0; }
.nv-kartochka .nvd-proverka-chev { width: 16px; height: 16px; flex: none; color: var(--nv-mid); transition: transform .2s; }
.nv-kartochka .nvd-proverka[open] .nvd-proverka-chev { transform: rotate(180deg); }
.nv-kartochka .nvd-proverka > summary:focus-visible { outline: 2px solid var(--nv-violet); outline-offset: 4px; border-radius: 4px; }
.nv-kartochka .nvd-proverka-zam { margin-top: 10px; }
.nv-kartochka .nvd-proverka-formy { display: grid; grid-template-columns: minmax(0, 1fr); min-width: 0; }
.nv-kartochka .nvd-mf {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  min-width: 0;
  margin: 12px 0 0;
  padding-top: 12px;
  border-top: 1px solid var(--nv-fog);
}
.nv-kartochka .nvd-mf-h { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; font-size: 13px; }
.nv-kartochka .nvd-mf-h b { font-weight: 700; }
.nv-kartochka .nvd-mf-polya {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  width: 100%;
  min-width: 0;
}
/* Вид сертификата (#1355): две кнопки-переключателя в строку, перенос на узком. */
.nv-kartochka .nvd-mf-vid { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; border: 0; min-width: 0; }
.nv-kartochka .nvd-mf-vid-l { width: 100%; padding: 0; margin-bottom: 2px; font-size: 12px; color: var(--nv-mid); }
.nv-kartochka .nvd-mf-vid label { position: relative; display: inline-flex; min-width: 0; cursor: pointer; }
.nv-kartochka .nvd-mf-vid input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.nv-kartochka .nvd-mf-vid span {
  display: inline-block;
  padding: 6px 10px;
  border: 1px solid var(--nv-lilac);
  border-radius: 4px;
  background: var(--nv-card);
  color: var(--nv-carbon);
  font-size: 12.5px;
  line-height: 1.3;
}
.nv-kartochka .nvd-mf-vid input:checked + span { border-color: var(--nv-plum); background: var(--nv-wash); color: var(--nv-plum); font-weight: 600; }
.nv-kartochka .nvd-mf-vid input:focus-visible + span { outline: 2px solid var(--nv-violet); outline-offset: 2px; }
.nv-kartochka .nvd-mf-pole { display: flex; flex-direction: column; gap: 4px; min-width: 0; font-size: 12px; color: var(--nv-mid); }
/* Подпись поля — прописными, мелко и жирно, как у полей макета. */
.nv-kartochka .nvd-mf-pole > span { font-size: 10.5px; font-weight: 700; letter-spacing: .057em; text-transform: uppercase; }
.nv-kartochka .nvd-mf-shir { grid-column: 1 / -1; }
.nv-kartochka .nvd-mf-pole input {
  width: 100%;
  min-width: 0;
  height: 36px;
  padding: 0 10px;
  border: 1px solid var(--nv-fog);
  border-radius: 4px;
  background: var(--nv-card);
  color: var(--nv-carbon);
  font: inherit;
  font-size: 14px;
  font-variant-numeric: tabular-nums;
}
.nv-kartochka .nvd-mf-pole input:focus { outline: 2px solid var(--nv-violet); outline-offset: 0; border-color: transparent; }
.nv-kartochka .nvd-mf-pole input[aria-invalid="true"] { border-color: var(--nv-bad-fg); }
.nv-kartochka .nvd-mf .nv-knopka[disabled] { opacity: .6; cursor: progress; }
.nv-kartochka .nvd-mf-otvet { width: 100%; min-width: 0; }
.nv-kartochka .nvd-mf-otvet:empty { display: none; }
.nv-kartochka .nvd-mf-otvet .nv-prov { border-top: 0; padding-bottom: 0; }
.nv-kartochka .nvd-mf-otvet a { color: var(--nv-plum); font-weight: 600; }
/* Поля и показатели из ответа госсервиса: подпись — значение. */
.nv-kartochka .nvd-mf-dannye-h { margin: 10px 0 0 32px; font-size: 11.5px; font-weight: 700; letter-spacing: .02em; color: var(--nv-mid); }
.nv-kartochka .nvd-mf-dannye {
  display: grid;
  grid-template-columns: minmax(0, 11em) minmax(0, 1fr);
  gap: 4px 12px;
  margin: 8px 0 0 32px;
  font-size: 12.5px;
  min-width: 0;
}
.nv-kartochka .nvd-mf-dannye dt { color: var(--nv-mid); overflow-wrap: anywhere; }
.nv-kartochka .nvd-mf-dannye dd { margin: 0; color: var(--nv-carbon); overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
.nv-kartochka .nvd-mf-ssylka { display: inline-block; margin: 10px 0 0 32px; font-size: 12.5px; }
@media (max-width: 479.98px) {
  .nv-kartochka .nvd-mf-dannye { grid-template-columns: minmax(0, 1fr); gap: 0; margin-left: 0; }
  .nv-kartochka .nvd-mf-dannye dd { margin-bottom: 6px; }
  .nv-kartochka .nvd-mf-dannye-h, .nv-kartochka .nvd-mf-ssylka { margin-left: 0; }
}
/* iOS приближает страницу у поля мельче 16 px (правило платформы). */
@media (max-width: 767.98px) {
  .nv-kartochka .nvd-mf-pole input { font-size: 16px; }
}
@media (min-width: 1080px) {
  .nv-kartochka .nvd-proverka-formy { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
  .nv-kartochka .nvd-proverka-formy .nvd-mf { border-top: 0; padding-top: 0; }
  .nv-kartochka .nvd-proverka-formy .nvd-mf + .nvd-mf { border-left: 1px solid var(--nv-fog); padding-left: 20px; }
}

/* ── ПЛАНШЕТ: 640–1079 ──
   Как в макете: номер декларации — в строку с заголовком, мелко; под
   ним продукция обычным текстом 14 px; кнопки — под текстом шапки,
   слева (в 820 px рядом с заголовком им тесно). */
@media (min-width: 640px) {
  .nv-kartochka .nvd-shapka { padding: 0; border: 0; border-radius: 0; background: transparent; }
  .nv-kartochka .nvd-shapka .nv-shapka-tekst { flex-basis: 100%; }
  .nv-kartochka .nvd-h1 .nv-pripiska { display: inline-block; max-width: none; margin-top: 0; }
  .nv-kartochka .nvd-produkciya { margin-top: 8px; font-size: 14px; color: var(--nv-carbon); }
  .nv-kartochka .nvd-shapka .nv-deystviya { width: auto; }
  .nv-kartochka .nvd-shapka .nv-deystviya form { flex: none; }
  .nv-kartochka .nvd-shapka .nv-deystviya form .nv-knopka { width: auto; }
  .nv-kartochka .nvd-otvet { font-size: 14px; color: var(--nv-charcoal); }
}

/* ── ПК: от 1080 ── текст шапки слева (до 780 px), кнопки справа. */
@media (min-width: 1080px) {
  .nv-kartochka .nvd-shapka .nv-shapka-tekst { flex: 0 1 780px; }
}