/**
 * gzp-tender.css — стили ВЫВОДА страницы тендера Gizmoll.ru
 * ВЕРСИЯ 20260929_3   (package v21)
 *
 * ТОЛЬКО страница тендера (вывод). Глобальные стили сайта НЕ меняются:
 * все селекторы здесь — свои (.gzp-*), либо точечные по id (#gzp-*,
 * #material_payment_block). Ни одно правило не задевает чужие классы.
 *
 * ============================== ЧТО ИЗМЕНИЛОСЬ В v20 ==========================
 * 1. ТИПОГРАФИКА СПИСКОВ (замечание 1): кегль 15px вместо 14, подписи темнее
 *    (#64748b), значения почти чёрные (#1e293b), межстрочный 1.5. Бледного
 *    мелкого текста больше нет.
 * 2. ЧЕТКОЕ РАЗДЕЛЕНИЕ НА 2 СТОЛБЦА (замечания 1, 3, 8): списки переведены на
 *    grid-auto-flow: column с явным числом строк (--gzp-cols задаёт
 *    gzp-tender.js по факту строк, есть таблица запасных значений на чистом CSS
 *    через :has() — работает и без скрипта). Строки встают ПОПАРАМ, поэтому:
 *      • выравнивание по строкам идеальное,
 *      • подчёркивание есть У ВСЕХ строк, кроме последней пары
 *        (раньше :last-child снимал его в каждой колонке отдельно — отсюда
 *        «подчёркивания не у всех»),
 *      • между колонками — промежуток 36px. Вертикальный разделитель заказчик
 *        посмотрел и попросил убрать — в v20 его нет.
 *    Модификатор «строка на обе колонки» УДАЛЁН — заказчик просил «никаких
 *    отклонений»: все строки в колонках, длинные тексты переносятся.
 * 3. БЛОК СПРАВА ОТ ФОТО (замечание 6): заголовок «Параметры» вернулся в шаблон,
 *    а список здесь принудительно в ОДНУ колонку на всех ширинах — область и так
 *    занимает половину страницы.
 * 4. «СРОКИ ТЕНДЕРА» (замечание 8): ТРИ колонки на десктопе, лейбл СВЕРХУ —
 *    значение СНИЗУ. Дата и время не разрываются (.gzp-nowrap): на мобилке
 *    «до 26.12.2026 • 23:59» больше не переносит время на вторую строку.
 * 5. ФРАЗА ПРО 44-ФЗ (замечание 7): .gzp-legal-note — обычный красный текст
 *    меньшим кеглем под заголовком вкладки «О тендере», иконка-крестик
 *    сохранена. Плашки с фоном/скруглением/тенью больше нет.
 * 6. НОВОЕ: стили таба «Критерии заказчика» (.gzp-crit-*) и подсказки-ссылки
 *    на штатные модалки (.gzp-hint) — вопросики у «Ценового сегмента» и
 *    «Вида проекта» (в v14 модалки modal4/modal5 были в шаблоне, но без вызова).
 * 7. Мобильная версия (≤768px) — одна колонка, как и была; разделитель скрыт.
 *
 * Палитра — корпоративные цвета страницы тендера:
 *   #029cf2 акцент синий · #00cd6e зелёный · #2e3841/#1e293b тёмный текст
 *   #475569/#64748b/#94a3b8 серые · #e2e8f0/#eef1f4 линии · #ff4444 красный
 *   #F59E0B янтарный · #64748B «черновик»
 */

/* ==================== служебное ==================== */
/* BUILD-метка. Её читает /js/gzp-tender.js и сразу пишет в консоль внятную ошибку,
   если на сервере лежит СТАРЫЙ css (тогда список рисуется «голым», без стилей).
   Проверка руками: открыть /css/gzp-tender.css и Ctrl+F по «20260929_3». */
:root { --gzp-build: 20260929_3; }

.gzp-t-hidden { display: none !important; }

/* островок данных и невидимые носители сырых кодов не должны быть видны никогда */
#gzp-tender-data,
.gzp-carrier { display: none !important; }

/* ==================== СПИСОК ПАРАМЕТРОВ ====================
   Один класс на все места вывода: справа от фото, вкладка «Параметры»,
   вкладка «Условия», вкладка «Критерии», серверные строки шаблона.
   Подпись слева, значение справа, линия между строками, на десктопе —
   ДВЕ колонки с вертикальным разделителем. */
.gzp-list,
.gzp-tpl-list {
  --gzp-gap: 36px;
  display: grid;
  grid-auto-flow: column;
  grid-template-rows: repeat(var(--gzp-cols, 1), auto);
  grid-template-columns: minmax(0, 1fr);
  gap: 0 var(--gzp-gap);
  position: relative;
  width: 100%;
  margin: 4px 0 0;
}

/* таблица запасных значений --gzp-cols на чистом CSS: если скрипт не отработал
   (или отключен), колонки всё равно будут сбалансированы. :has() поддерживают
   все современные браузеры; в старых сработает значение по умолчанию (1 строка
   = одна колонка), то есть деградация безопасная. */
@supports selector(:has(*)) {
  .gzp-list:has(> :nth-child(2)),  .gzp-tpl-list:has(> :nth-child(2))  { --gzp-cols: 1; }
  .gzp-list:has(> :nth-child(3)),  .gzp-tpl-list:has(> :nth-child(3))  { --gzp-cols: 2; }
  .gzp-list:has(> :nth-child(5)),  .gzp-tpl-list:has(> :nth-child(5))  { --gzp-cols: 3; }
  .gzp-list:has(> :nth-child(7)),  .gzp-tpl-list:has(> :nth-child(7))  { --gzp-cols: 4; }
  .gzp-list:has(> :nth-child(9)),  .gzp-tpl-list:has(> :nth-child(9))  { --gzp-cols: 5; }
  .gzp-list:has(> :nth-child(11)), .gzp-tpl-list:has(> :nth-child(11)) { --gzp-cols: 6; }
  .gzp-list:has(> :nth-child(13)), .gzp-tpl-list:has(> :nth-child(13)) { --gzp-cols: 7; }
  .gzp-list:has(> :nth-child(15)), .gzp-tpl-list:has(> :nth-child(15)) { --gzp-cols: 8; }
  .gzp-list:has(> :nth-child(17)), .gzp-tpl-list:has(> :nth-child(17)) { --gzp-cols: 9; }
  .gzp-list:has(> :nth-child(19)), .gzp-tpl-list:has(> :nth-child(19)) { --gzp-cols: 10; }
  .gzp-list:has(> :nth-child(21)), .gzp-tpl-list:has(> :nth-child(21)) { --gzp-cols: 11; }
  .gzp-list:has(> :nth-child(23)), .gzp-tpl-list:has(> :nth-child(23)) { --gzp-cols: 12; }
}

/* две колонки — с 992px (на 769–991px тесно, там одна) */
@media (min-width: 992px) {
  .gzp-list,
  .gzp-tpl-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* v20 (правка по замечанию заказчика): вертикального разделителя между
   колонками НЕТ — заказчик посмотрел и попросил убрать. Класс gzp-2col оставлен
   как крючок (его ставит скрипт), но ничего не рисует: разделение столбцов
   держится на промежутке --gzp-gap и общих подчёркиваниях строк. */

/* одна строка списка */
.gzp-row,
.gzp-tpl-row {
  display: flex;
  align-items: baseline;
  gap: 10px;
  min-width: 0;
  padding: 11px 0;
  border-bottom: 1px solid #eef1f4;
  font-size: 15px;
  line-height: 1.5;
}
/* подчёркивание снимается только с ПОСЛЕДНЕЙ ПАРЫ строк (а не с последней строки
   каждой колонки) — поэтому линии у всех строк одинаковые.
   N = 2·(--gzp-cols) − 1 и 2·(--gzp-cols) */
.gzp-list > .gzp-row:nth-last-child(-n + calc(2 * var(--gzp-cols, 1) ))),
.gzp-list > .gzp-tpl-row:nth-last-child(-n + calc(2 * var(--gzp-cols, 1) ))),
.gzp-tpl-list > .gzp-row:nth-last-child(-n + calc(2 * var(--gzp-cols, 1) ))),
.gzp-tpl-list > .gzp-tpl-row:nth-last-child(-n + calc(2 * var(--gzp-cols, 1) ))) {
  border-bottom: 0;
}

.gzp-label {
  flex: 0 1 auto;
  max-width: 62%;
  color: #64748b;
  font-weight: 400;
  word-break: break-word;
}
.gzp-value {
  flex: 1 1 auto;
  min-width: 0;
  margin-left: auto;
  text-align: right;
  color: #1e293b;
  font-weight: 600;
  word-break: break-word;
}
.gzp-value.gzp-empty {
  color: #94a3b8;
  font-weight: 400;
}
/* единица измерения внутри значения — обычным весом, серым */
.gzp-unit {
  font-weight: 400;
  color: #64748b;
  margin-left: 4px;
}
/* неразрывная связка (дата + время, значение + единица) */
.gzp-nowrap { white-space: nowrap; }

/* ==================== ГРУППЫ С ПОДЗАГОЛОВКАМИ (вкладка «Параметры») ======== */
.gzp-group { margin: 0 0 18px; }
.gzp-group:last-child { margin-bottom: 2px; }
.gzp-group-title {
  display: block;
  margin: 0 0 4px;
  padding: 0 0 8px;
  border-bottom: 1px solid #e2e8f0;
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: .6px;
  text-transform: uppercase;
  color: #94a3b8;
  line-height: 1.3;
}
.gzp-empty-all {
  padding: 9px 0;
  color: #94a3b8;
  font-size: 14px;
}

/* ==================== СТРОКИ, СОБРАННЫЕ В ШАБЛОНЕ (не скриптом) ==============
   Там, где значение серверное ($OTHER7$, $FILTER2_VALUE$, $CAT_NAME$) или где
   стоит uCoz-условие по группе, строка остаётся в шаблоне — но в ТОЙ ЖЕ
   раскладке, поэтому выглядит одинаково со строчками из скрипта.
   ВАЖНО: это ТОЛЬКО серверные строки. Поля, различающиеся по категориям,
   в шаблоне не хардкодятся — их рисует gzp-tender.js. */
.gzp-tpl-row > .gzp-label { max-width: 62%; }
/* строка, которая целиком скрыта/показана скриптом (id сохранён!) */
.gzp-tpl-row.gzp-row-toggle { display: none; }
.gzp-tpl-row.gzp-row-toggle.gzp-on { display: flex; }

/* ==================== БЛОК СПРАВА ОТ ФОТО — ВСЕГДА ОДНА КОЛОНКА =============
   .tender-description-block занимает половину карточки, двум колонкам там
   физически тесно (замечание 6). Одна колонка на всех ширинах. */
#gzp-params-main .gzp-list,
#gzp-params-main.gzp-list {
  grid-auto-flow: row;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: none;
  --gzp-gap: 0px;
}
#gzp-params-main .gzp-row,
#gzp-params-main .gzp-tpl-row { padding: 10px 0; }
/* последняя строка блока — без подчёркивания (тут поток row, поэтому просто
   last-child) */
#gzp-params-main .gzp-row:last-child,
#gzp-params-main .gzp-tpl-row:last-child { border-bottom: 0; }

/* ==================== СРОКИ ТЕНДЕРА: 3 КОЛОНКИ, ЛЕЙБЛ СВЕРХУ ================
   Замечание 8: на десктопе три колонки, подпись сверху — значение снизу.
   На планшете две, на мобилке одна. Дата и время не разрываются. */
.gzp-dates-3 {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 22px;
  width: 100%;
  margin: 6px 0 0;
}
.gzp-date-cell { min-width: 0; }
.gzp-date-cell > .gzp-label {
  display: block;
  max-width: none;
  margin: 0 0 5px;
  color: #94a3b8;
  font-size: 12.5px;
  font-weight: 600;
  letter-spacing: .3px;
  text-transform: uppercase;
  line-height: 1.35;
}
.gzp-date-cell > .gzp-value {
  display: block;
  margin: 0;
  text-align: left;
  color: #1e293b;
  font-size: 15.5px;
  font-weight: 600;
  line-height: 1.4;
}
@media (max-width: 991px) {
  .gzp-dates-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
}
@media (max-width: 768px) {
  .gzp-dates-3 { grid-template-columns: minmax(0, 1fr); gap: 14px; }
}

/* ==================== ФРАЗА ПРО 44-ФЗ (замечание 7) ==========================
   Обычный красный текст меньшим кеглем под заголовком вкладки «О тендере».
   Иконка-крестик сохранена. Никакого фона, скруглений и теней. */
.gzp-legal-note {
  margin: -2px 0 12px;
  color: #ff4444;
  font-size: 13px;
  line-height: 1.45;
  font-weight: 400;
}
.gzp-legal-note i { margin-right: 5px; font-size: 13px; }

/* ==================== ПОДСКАЗКИ-ВОПРОСИКИ (замечание 5) ======================
   Штатный класс uved-open-modal сохраняется: модалки открывает существующий
   скрипт страницы, новых обработчиков не добавляем. */
.gzp-value .uved-open-modal,
.gzp-hint {
  margin-left: 3px;
  color: #029cf2;
  font-size: 14px;
  cursor: pointer;
}
.gzp-value .uved-open-modal:hover,
.gzp-hint:hover { color: #0279bd; }
.gzp-hint {
  display: inline-block;
  color: #029cf2;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  border-bottom: 1px dotted rgba(2, 156, 242, .5);
}
.gzp-hint i { margin-left: 4px; font-size: 12px; }

/* ==================== ВКЛАДКА «КРИТЕРИИ ЗАКАЗЧИКА» (v20) ====================
   Вопросы заказчика к подрядчикам: один блок на вопрос, лейбл сверху —
   ответ снизу. Формат тот же, что у остальных списков страницы. */
.gzp-crit-q {
  padding: 8px 0;
  border-bottom: 0px solid #eef1f4;
}
.gzp-crit-q:last-child { border-bottom: 0; }
.gzp-crit-q > .gzp-label {
  display: inline-flex;
  max-width: none;
  margin: 0 0 7px;
  color: #2d3e50;
  font-size: 15px;
  line-height: 1.45;
}

.gzp-crit-a {
  display: flex;
  flex-direction: column;   /* вместо row по умолчанию */
  flex-wrap: wrap;
  gap: 8px;
  align-items: flex-start;  /* чтобы чипы не растягивались на всю ширину */
}



/* выбранный пункт — чип */
.gzp-crit-chip {
  display: inline-flex;
  align-items: center;
  padding: 0px;
  color: #0b6ea8;
  font-size: 14.5px;
  font-weight: 600;
  line-height: 1.35;
}
.gzp-crit-chip::before {
  content: "•"; /* или "\00BB" */
  margin-right: 6px;
  font-size: 18px;
 
  display: inline-block;
}




/* решающий критерий — акцентный */
.gzp-crit-chip.gzp-crit-main {
  background: #97df4c;
  border-color: #97df4c;
  color: #fff;
border-radius: 999px;
padding: 3px 10px;
}
.gzp-crit-chip.gzp-crit-main::before {
  content: "★";
  margin-right: 6px;
  font-size: 11px;

}
/* свой текст заказчика */
.gzp-crit-own {
  padding: 8px 12px;
  border-left: 3px solid #029cf2;
  background: #f7fafc;
  border-radius: 0 8px 8px 0;
  color: #1e293b;
  font-size: 14.5px;
  line-height: 1.45;
}
.gzp-crit-none {
  color: #94a3b8;
  font-size: 14.5px;
  line-height: 1.5;
}
.gzp-crit-none .gzp-hint { margin-top: 4px; }




#gzp-criteria-tab {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: auto auto;   /* две строки = две «пары» в каждой колонке */
  grid-auto-flow: column;          /* заполняем сверху вниз, потом следующая колонка */
  column-gap: 12px;
}

/* «Другой важный критерий» — на всю ширину, отдельной строкой под сеткой */
#gzp-criteria-tab > .gzp-crit-q--wide {
  grid-column: 1 / -1;
  grid-row: 3;
}

/* Мобилка: одна колонка, обычный поток */
@media (max-width: 640px) {
  #gzp-criteria-tab {
    grid-template-columns: 1fr;
    grid-template-rows: auto;
    grid-auto-flow: row;
  }
  #gzp-criteria-tab > .gzp-crit-q--wide {
    grid-column: auto;
    grid-row: auto;
  }
}





/* ==================== КАПСУЛА СТАТУСА (11 «Черновик» / 12 «На проверке») =====
   Плашки статуса сверху больше нет (заказчик убрал 28.09): статус виден внизу,
   блок «Текущий статус» рисует tender_status.js. Капсула — в карточке заголовка,
   видят только автор и админ (режет uCoz на сервере). */
.gzp-chip-line { margin: 8px 0 0 0; }
.gzp-status-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 3px 11px;
  border-radius: 999px;
  background: #f0f3f8;
  border: 1px solid #e2e8f0;
  font-size: 12.5px;
  font-weight: 600;
  line-height: 1.5;
  white-space: nowrap;
  color: var(--gzp-status-color, #2e3841);
}
.gzp-status-chip i { font-size: 11px; }
.gzp-status-code-11 { --gzp-status-color: #64748B; }
.gzp-status-code-12 { --gzp-status-color: #F59E0B; }
.gzp-status-code-11.gzp-status-chip { background: #f1f5f9; border-color: #cbd5e1; }
.gzp-status-code-12.gzp-status-chip { background: #fff7e8; border-color: #f7d9a0; }

/* ==================== МОБИЛЬНЫЕ (≤768px — одна колонка) ===================== */
@media (max-width: 768px) {
  .gzp-list,
  .gzp-tpl-list {
    grid-auto-flow: row;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: none;
    gap: 0;
  }
  .gzp-list > .gzp-row:last-child,
  .gzp-list > .gzp-tpl-row:last-child,
  .gzp-tpl-list > .gzp-row:last-child,
  .gzp-tpl-list > .gzp-tpl-row:last-child { border-bottom: 0; }
  .gzp-label { max-width: 58%; }
  .gzp-row, .gzp-tpl-row { padding: 10px 0; }
}

/* ==================== ПЛАНШЕТЫ 769–991px ====================================
   Двум колонкам тесно на половине ширины карточки — одна колонка, но без
   мобильного уплотнения (кегль остаётся десктопным). */
@media (min-width: 769px) and (max-width: 991px) {
  .gzp-list,
  .gzp-tpl-list {
    grid-auto-flow: row;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: none;
    gap: 0;
  }
  .gzp-list > .gzp-row:last-child,
  .gzp-list > .gzp-tpl-row:last-child,
  .gzp-tpl-list > .gzp-row:last-child,
  .gzp-tpl-list > .gzp-tpl-row:last-child { border-bottom: 0; }
}

/* ==================== v21: ВОПРОСИКИ-ПОДСКАЗКИ ====================
   В v21 значок подсказки лежит В ШАБЛОНЕ страницы (span#gzp-hint-modal4 /
   span#gzp-hint-modal5 рядом с заголовком «Параметры»), а gzp-tender.js только
   переставляет его в строку значения. Поэтому стиль задан здесь и не зависит от
   того, успел ли скрипт отработать: подсказка видна в любом случае. */
.gzp-hint-i {
  margin-left: 6px;
  color: #029cf2;
  font-size: 15px;
  line-height: 1;
  cursor: pointer;
  vertical-align: center;
text-decoration: none ;
  transition: color .15s ease, transform .15s ease;
}
a .gzp-hint-i{
  vertical-align: center;
text-decoration: none !important;
}
a .gzp-hint{
  vertical-align: center;
text-decoration: none !important;
}
.gzp-hint,
.gzp-hint-i {
    text-decoration: none !important;
}

.gzp-hint-i:hover,
.gzp-hint-i:focus { color: #0179bd; transform: scale(1.12); outline: none; }
.gzp-hint-i:focus-visible { box-shadow: 0 0 0 2px rgba(2, 156, 242, .35); border-radius: 50%; }

/* заголовок вкладки «Критерии заказчика»: вопросик рядом с текстом.
   Селекторы — только свои классы .gzp-*: чужие теги страницы не задеваем. */
.gzp-crit-head .gzp-hint { text-decoration: none; }
.gzp-crit-head .gzp-hint .gzp-hint-i { font-size: 16px; }

/* если JavaScript выключен — подсказки остаются у заголовка и видно пояснение */
.gzp-hint-static {
  display: inline-block;
  margin: 0 0 4px;
  color: #64748b;
  font-size: 13px;
  line-height: 1.4;
text-decoration: none !important;
}
.gzp-hint-static i { color: #029cf2; margin-right: 4px; }