/* Общие элементы выбора для всех конфигураторов.
   Раньше механизм выбирался двумя выпадающими списками — покупатель не видел,
   что берёт. Теперь везде: чипсы типов + сетка фотокарточек (как на werkel). */

.cfg-chips{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:11px}
.cfg-chip{border:1px solid var(--line,#e6e4df);background:#fff;border-radius:16px;padding:6px 12px;
  font-size:13px;color:var(--ink-2,#6c6a64);cursor:pointer;transition:.15s;white-space:nowrap;font-family:inherit}
.cfg-chip:hover{border-color:var(--ink-2,#6c6a64)}
.cfg-chip span{color:#b0ada4;font-size:11px;margin-left:3px}
.cfg-chip.on{background:var(--ink,#1b1b1a);color:#fff;border-color:var(--ink,#1b1b1a)}
.cfg-chip.on span{color:#cfcdc6}

/* сетка фотокарточек товара */
.cfg-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(94px,1fr));gap:8px;
  max-height:330px;overflow:auto;padding:1px}
.cfg-cards.tall{max-height:420px}
.cfg-card{border:1px solid var(--line,#e6e4df);background:#fff;border-radius:10px;padding:6px;cursor:pointer;
  text-align:center;display:flex;flex-direction:column;gap:3px;transition:.15s;font-family:inherit;position:relative}
.cfg-card:hover{border-color:var(--ink-2,#6c6a64)}
.cfg-card.on{border-color:var(--ink,#1b1b1a);box-shadow:0 0 0 1px var(--ink,#1b1b1a) inset}
.cfg-card img{width:100%;aspect-ratio:1;object-fit:contain;background:#f6f5f2;border-radius:6px;display:block}
.cfg-card .cc-n{font-size:10.5px;color:var(--ink-2,#6c6a64);line-height:1.25;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.cfg-card .cc-p{font-size:12px;font-weight:700;color:var(--ink,#1b1b1a)}
.cfg-card .cc-p.ask{font-weight:600;font-size:10.5px;color:#a09d95}
/* товар без фото — не пустой прямоугольник, а подпись */
.cfg-card .cc-no{width:100%;aspect-ratio:1;background:#f6f5f2;border-radius:6px;display:grid;place-items:center;
  font-size:9.5px;color:#b8b5ad;letter-spacing:.04em;text-transform:uppercase}
.cfg-card.on::after{content:'✓';position:absolute;top:5px;right:5px;width:17px;height:17px;border-radius:50%;
  background:var(--ink,#1b1b1a);color:#fff;font-size:10px;line-height:17px}

/* кружки цвета */
.cfg-sws{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:10px;align-items:center}
.cfg-sw{width:25px;height:25px;border-radius:50%;border:1px solid rgba(0,0,0,.2);cursor:pointer;padding:0;
  box-shadow:0 1px 2px rgba(0,0,0,.1);flex:none}
.cfg-sw.on{outline:2px solid var(--ink,#1b1b1a);outline-offset:2px}

.cfg-more{display:block;width:100%;margin-top:8px;padding:9px;border:1px solid var(--line,#e6e4df);background:#fff;
  border-radius:10px;font-size:12.5px;font-weight:600;color:var(--ink-2,#6c6a64);cursor:pointer;font-family:inherit}
.cfg-more:hover{border-color:var(--ink-2,#6c6a64);color:var(--ink,#1b1b1a)}

.cfg-note{font-size:11.5px;color:#a09d95;margin-top:8px}
.cfg-empty{font-size:12.5px;color:#a09d95;padding:14px 4px;text-align:center}

@media(max-width:560px){
  .cfg-cards{grid-template-columns:repeat(auto-fill,minmax(82px,1fr));max-height:290px}
  .cfg-chip{padding:6px 10px;font-size:12.5px}
}

/* Форма заявки (public/js/lead-form.js) — общая для всех конфигураторов */
.lf-body{display:none;margin-top:8px;gap:8px;flex-direction:column}
.lf-body.show{display:flex}
.lf-body input{border:1px solid var(--line,#e6e4df);border-radius:10px;padding:11px 13px;font-size:14px;font-family:inherit}
.lf-err{font-size:12.5px;color:#a33;padding:2px 2px 0}
.lf-ok{text-align:center;color:#4a7a52;padding:12px;font-size:14px}
.lf-open,.lf-send{width:100%;margin-top:8px}
.lf-note{font-size:11px;color:#a09d95;line-height:1.45;margin-top:8px}
.lf-note a{text-decoration:underline}