/* ============================================================
   TOVIAN · ПОИСК ТОВАРА — доводка «лаборатории подбора»
   Подключается ПОСЛЕДНИМ, после poisk-lab.css.

   Здесь живут только те блоки, которые появляются ПОСЛЕ действия человека
   и которых в исходной вёрстке не было: отсутствующее значение, пустая
   выдача, непереведённые поля, недоступный режим. Без стилей они выпадали
   бы голым текстом на тёмный фон — то есть ровно тем, чем страница
   «слетает» после нажатия кнопки. Оформление берётся у соседей: те же
   рамки, радиусы, шрифты и лаймовый акцент, что у .pl-sec и .pl-card.
   ============================================================ */

/* ---------- отсутствующее значение ----------
   Ноль и прочерк читаются как измеренная величина: «0 ¥» — как даром,
   «—» — как ноль. Отсутствие обязано выглядеть словом и НЕ выглядеть
   данными: тот же кегль, но приглушённый цвет и курсив. */
.pl-nd{
  font-style:italic;
  color:var(--faint);
  font-weight:400;
  letter-spacing:0;
}
.pl-card__price--none{
  font:400 13px/1.4 'Inter',sans-serif;
  color:var(--faint);
}
.pl-card__price--none .pl-nd{font-size:13px;}
.pl-reco__obj.is-nd{color:var(--faint);font-style:italic;}
.pl-cmprow__v .pl-nd{font-size:12.5px;}

/* ---------- пустое состояние внутри секции ----------
   Пустая сетка на тёмном фоне неотличима от незагрузившегося блока.
   Рамка + причина словами: видно, что это ответ, а не дыра. */
.pl-blank{
  display:flex;
  flex-direction:column;
  gap:7px;
  padding:clamp(18px,2.4vw,26px);
  border:1px dashed var(--line-strong);
  border-radius:16px;
  background:rgba(255,255,255,.02);
  text-align:center;
}
.pl-blank b{
  font:500 clamp(14.5px,1.2vw,16.5px)/1.3 'Space Grotesk',sans-serif;
  letter-spacing:-.01em;
  text-transform:lowercase;
  color:var(--ink);
}
.pl-blank span{
  font-size:12.5px;
  line-height:1.55;
  color:var(--faint);
  max-width:58ch;
  margin:0 auto;
  text-wrap:pretty;
}

/* ---------- результат неполон: часть полей без перевода ----------
   Это не украшение, а предупреждение: карточка беднее, чем оригинал.
   Янтарный — тот же язык, что у .pl-warn и .pl-diff--warn. */
.pl-locnote{
  border:1px solid rgba(230,162,60,.4);
  border-radius:14px;
  background:rgba(230,162,60,.06);
  padding:12px 16px;
  margin-bottom:14px;
  font-size:12.5px;
  line-height:1.55;
  color:var(--muted);
  text-wrap:pretty;
}
.pl-locnote[hidden]{display:none;}
.pl-locnote b{color:#e6a23c;font-weight:600;}

/* ---------- режим или площадка недоступны ----------
   Отказ, сказанный ДО нажатия, — это подсказка. Тот же отказ после
   нажатия читается как поломка сервиса. */
.pl-modenote{
  display:flex;
  flex-direction:column;
  gap:5px;
  margin-bottom:12px;
  padding:12px 16px;
  border:1px solid rgba(230,162,60,.38);
  border-radius:14px;
  background:rgba(230,162,60,.05);
}
.pl-modenote b{
  font:500 12.5px/1.3 'Space Grotesk',sans-serif;
  text-transform:lowercase;
  color:#e6a23c;
}
.pl-modenote span{font-size:12px;line-height:1.5;color:var(--muted);text-wrap:pretty;}
/* Вкладка режима и плашка площадки, которых сервис сегодня не выполняет.
   Метка ставится поверх кнопки, а не в поток: добавленная ширина ломала
   ряд вкладок на узком экране — подпись «по описанию» вставала в две
   строки, и ряд выглядел сломанным. */
.pl-mode{position:relative;}
.pl-mode.is-off{opacity:.62;}
.pl-mode.is-off::after{
  content:"";
  position:absolute;
  top:8px;right:9px;
  width:5px;height:5px;border-radius:50%;
  background:#e6a23c;
}
/* Ряд вкладок обязан помещаться в экран: max-content его не ограничивает. */
.pl-modes{max-width:100%;box-sizing:border-box;}
@media(max-width:520px){
  .pl-modes{width:100%;gap:2px;padding:4px;}
  .pl-mode{flex:1 1 0;min-width:0;padding:0 8px;gap:6px;font-size:12.5px;white-space:nowrap;}
  .pl-mode svg{width:13px;height:13px;}
}
.pl-plat.is-off{
  opacity:.42;
  text-decoration:line-through;
  text-decoration-color:rgba(230,162,60,.7);
}

/* ---------- подпись у кнопки примера ----------
   Кнопка больше не рисует готовый результат, и это должно быть видно
   до нажатия, а не после. */
.pl-ex__note{
  flex:1 1 100%;
  text-align:center;
  font-size:11.5px;
  line-height:1.45;
  color:var(--faint);
}

/* ---------- характеристики предложения ----------
   Пары «имя — значение» из карточки 1688, уже переведённые. Верстаются
   как продолжение .pl-card__meta, чтобы карточка не распадалась. */
.pl-card__attrs{
  display:flex;
  flex-direction:column;
  gap:4px;
  padding-top:2px;
}
.pl-card__attrs span{
  display:flex;
  gap:8px;
  align-items:baseline;
  font-size:11.5px;
  line-height:1.4;
  color:var(--ink);
  min-width:0;
}
.pl-card__attrs i{
  flex:0 0 auto;
  max-width:46%;
  font-style:normal;
  color:var(--faint);
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
/* Значение характеристики — не более трёх строк.
   1688 печатает в «Цвет» и «Спецификацию» весь перечень исполнений: «30
   классический синий, 30 новый классический синий, …» — под тысячу знаков.
   Замерено на живой выдаче по запросу «массажный ролик»: одна такая карточка
   выросла втрое против соседних, и рядом с ними осталось пустое поле в
   полэкрана — сетка тянет колонки по самой высокой. Текст не режем и не
   выбрасываем: он целиком лежит в разметке и в подсказке по наведению,
   ограничена только высота показа. */
.pl-card__attrs em{
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
  min-width:0;
  font-style:normal;
  overflow-wrap:anywhere;
}
.pl-tag--warn{
  color:#e6b464;
  border-color:rgba(230,162,60,.35);
  background:rgba(230,162,60,.07);
}

/* ---------- шкала стадий ----------
   Ячейки рисует скрипт по ответу сервера, поэтому их может быть одна.
   Пока их нет — контейнер не должен занимать высоту и оставлять дыру. */
.pl-proc__stages:empty{display:none;}

/* ---------- сравнение ----------
   Столбцов ровно столько, сколько кандидатов: жёсткие три растягивали
   две колонки на пустое место справа. */
.pl-cmp .pl-cmprow{grid-template-columns:150px repeat(auto-fit,minmax(0,1fr));}
@media(max-width:680px){
  .pl-cmp .pl-cmprow{grid-template-columns:1fr;}
}

/* ---------- узкий экран ----------
   Длинные названия предложений и адреса не должны раздвигать карточку и
   тянуть за собой горизонтальную полосу на всю страницу. */
.pl-card__title,
.pl-card__src span,
.pl-blank span,
.pl-locnote{overflow-wrap:anywhere;}
.pl-card__src{flex-wrap:wrap;}
@media(max-width:560px){
  .pl-modenote,.pl-locnote{padding:11px 13px;}
  .pl-blank{padding:16px 14px;}
}

/* Ссылка на страницу входа в блоке «нужен вход владельца».
   Без явного стиля она унаследовала бы серый цвет подписи и слилась с текстом —
   человек прочитал бы «выполнить вход» как часть фразы, а не как действие. */
.pl-offline__link {
  color: var(--lime, #a8e80c);
  text-decoration: none;
  border-bottom: 1px solid rgba(168, 232, 12, .4);
  white-space: nowrap;
}
.pl-offline__link:hover { border-bottom-color: var(--lime, #a8e80c); }