/* Палитра гайдлайна HydroCube */
:root {
  --yellow: #ddc738;
  --blue: #1b468c;
  --ice: #b5b7bb;
  --silver: #8c8f90;
  --ink: #363d4a;
  --paper: #f3f4f5;
  --line: #e1e3e6;
  --white: #fff;
  --danger: #b3261e;
  --radius: 10px;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: Montserrat, Arial, sans-serif;
  font-size: 14px;
  color: var(--ink);
  background: var(--paper);
}
button, input, textarea, select { font: inherit; color: inherit; }
[hidden] { display: none !important; }

/* ---------- верхняя панель ---------- */
.topbar {
  position: sticky; top: 0; z-index: 20;
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  padding: 12px 28px;
  background: var(--ink); color: var(--white);
}
.topbar__brand { display: flex; align-items: center; gap: 18px; }
.topbar__title { font-size: 13px; color: var(--ice); border-left: 1px solid #556070; padding-left: 18px; }
.tabs { display: flex; gap: 4px; }
.tab {
  border: 0; background: transparent; color: var(--ice); cursor: pointer;
  padding: 8px 14px; border-radius: 6px; font-weight: 500; font-size: 13px; white-space: nowrap;
}
.tab:hover { color: var(--white); }
.tab.is-active { color: var(--ink); background: var(--yellow); }

/* ---------- раскладка ---------- */
.view { padding: 24px 28px 60px; max-width: 1480px; margin: 0 auto; }
.layout { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 24px; align-items: start; }
.steps { display: flex; flex-direction: column; gap: 18px; min-width: 0; }

.card {
  background: var(--white); border-radius: var(--radius); padding: 22px 24px 24px;
  box-shadow: 0 1px 2px rgb(54 61 74 / 6%);
}
.card.wide { max-width: 1100px; margin: 0 auto; }
.card__head { display: flex; align-items: baseline; gap: 12px; margin-bottom: 16px; flex-wrap: wrap; }
.card__head h2 { margin: 0; font-size: 18px; font-weight: 600; }
.card__head + .grid + .card__head { margin-top: 28px; }
.num { font-weight: 300; color: var(--silver); font-size: 18px; }
.hint { font-size: 12px; color: var(--silver); }

.grid { display: grid; gap: 12px 16px; }
.grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.span-2 { grid-column: span 2; }
.span-3 { grid-column: 1 / -1; }

.field { display: flex; flex-direction: column; gap: 5px; }
.field > span { font-size: 11.5px; font-weight: 500; color: var(--silver); }
.field em { font-style: normal; color: #6b7076; font-weight: 400; }
.field input, .field textarea, .lines input, .search {
  width: 100%; border: 1px solid var(--line); border-radius: 7px; background: var(--white);
  padding: 9px 11px; outline: none; transition: border-color .15s, box-shadow .15s;
}
.field textarea { resize: vertical; line-height: 1.45; }
.field input:focus, .field textarea:focus, .lines input:focus, .search:focus {
  border-color: var(--blue); box-shadow: 0 0 0 3px rgb(27 70 140 / 12%);
}
.search { margin-left: auto; width: 280px; padding: 8px 11px; }

.card--compact { padding-bottom: 6px; }
.card--compact .card__head { align-items: center; }
.select {
  border: 1px solid var(--line); border-radius: 7px; background: var(--white);
  padding: 8px 32px 8px 11px; min-width: 260px; font-weight: 500; cursor: pointer;
}
.select:focus { outline: none; border-color: var(--blue); box-shadow: 0 0 0 3px rgb(27 70 140 / 12%); }
.select.is-empty { border-color: var(--yellow); background: #fdfaea; }

.segmented { display: inline-flex; border: 1px solid var(--line); border-radius: 8px; padding: 3px; gap: 3px; width: fit-content; margin-bottom: 6px; }
.segmented button { border: 0; background: transparent; border-radius: 6px; padding: 7px 14px; cursor: pointer; font-size: 13px; font-weight: 500; color: var(--silver); }
.segmented button.is-active { background: var(--ink); color: var(--white); }
.pay-sum { font-weight: 600; margin-left: 6px; }
.pay-sum.ok { color: #2e7d32; }
.pay-sum.bad { color: var(--danger); }

.managers { display: flex; flex-direction: column; gap: 10px; margin-bottom: 4px; }
.manager-row { display: grid; grid-template-columns: 1.2fr 1fr 1.2fr 1.1fr auto; gap: 8px; align-items: start; }
.manager-row input, .manager-row textarea { width: 100%; border: 1px solid var(--line); border-radius: 7px; padding: 8px 10px; resize: vertical; }
.manager-row textarea { min-height: 38px; }
#add-manager, #add-constructor { margin: 4px 0 26px; }

/* ---------- каталог ---------- */
.chips { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 16px; }
.chip {
  border: 1px solid var(--line); background: var(--white); border-radius: 999px; cursor: pointer;
  padding: 6px 13px; font-size: 12.5px; font-weight: 500;
}
.chip:hover { border-color: var(--ice); }
.chip.is-active { background: var(--ink); border-color: var(--ink); color: var(--white); }
.chip .count { color: var(--silver); margin-left: 4px; font-weight: 400; }

.products { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 12px; max-height: 620px; overflow-y: auto; padding: 2px; }
.product {
  position: relative; display: flex; flex-direction: column; text-align: left;
  border: 1.5px solid var(--line); border-radius: 9px; background: var(--white); cursor: pointer; overflow: hidden;
  padding: 0; transition: border-color .15s, box-shadow .15s;
}
.product:hover { border-color: var(--ice); box-shadow: 0 4px 14px rgb(54 61 74 / 10%); }
.product.is-selected { border-color: var(--blue); box-shadow: 0 0 0 2px rgb(27 70 140 / 18%); }
.product img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; background: var(--paper); display: block; }
.product__body { padding: 9px 11px 11px; display: flex; flex-direction: column; gap: 3px; }
.product__model { font-weight: 700; font-size: 15px; }
.product__type { font-size: 11.5px; color: var(--silver); line-height: 1.35; }
.product__specs { font-size: 11.5px; color: var(--ink); margin-top: 3px; }
.product__check {
  position: absolute; top: 8px; right: 8px; width: 26px; height: 26px; border-radius: 50%;
  display: grid; place-items: center; background: rgb(255 255 255 / 92%); color: var(--silver);
  font-size: 15px; font-weight: 700; box-shadow: 0 1px 3px rgb(0 0 0 / 15%);
}
.product.is-selected .product__check { background: var(--blue); color: var(--white); }
.product__info {
  position: absolute; top: 8px; left: 8px; border: 0; border-radius: 6px; cursor: pointer;
  background: rgb(54 61 74 / 85%); color: var(--white); font-size: 11px; padding: 4px 8px; font-weight: 500;
}
.product__info:hover { background: var(--ink); }

/* ---------- позиции ---------- */
.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; }
th { font-size: 11px; font-weight: 500; color: var(--silver); text-align: left; padding: 8px 6px; border-bottom: 1px solid var(--line); white-space: nowrap; }
td { padding: 8px 6px; border-bottom: 1px solid var(--line); vertical-align: middle; }
.r { text-align: right; }
.lines td.money { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; font-size: 13px; }
.lines td.money.strong { font-weight: 600; }
.lines .name { min-width: 220px; }
.lines .name b { font-size: 13.5px; }
.lines .name small { display: block; color: var(--silver); font-size: 11.5px; }
.lines .name input { margin-top: 5px; font-size: 12px; padding: 5px 8px; }
.lines input.num { width: 76px; text-align: right; padding: 7px 8px; }
.lines input.price { width: 150px; }
.lines input.vat { width: 62px; }
.lines tr.empty-price input.price { border-color: var(--yellow); background: #fdfaea; }
.remove { border: 0; background: none; color: var(--silver); cursor: pointer; font-size: 17px; padding: 4px 6px; border-radius: 5px; }
.remove:hover { color: var(--danger); background: #fbeeed; }
.empty { color: var(--silver); font-size: 13px; padding: 14px 0; }

.toggles { display: flex; flex-wrap: wrap; gap: 8px 18px; align-items: center; margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--line); font-size: 13px; }
.toggles__label { color: var(--silver); font-size: 12px; font-weight: 500; }
.toggles label { display: inline-flex; gap: 6px; align-items: center; cursor: pointer; }
input[type=checkbox] { accent-color: var(--blue); width: 15px; height: 15px; }

/* ---------- кнопки ---------- */
.btn {
  display: inline-flex; justify-content: center; align-items: center; gap: 8px; width: 100%;
  border: 0; border-radius: 8px; padding: 13px 18px; cursor: pointer;
  background: var(--blue); color: var(--white); font-weight: 600; font-size: 14px;
  transition: background .15s;
}
.btn:hover { background: #163a75; }
.btn:disabled { background: #e4e6e9; color: #6b7076; border-color: #e4e6e9; cursor: not-allowed; }
.btn-row { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 8px; }
.btn-row .btn { padding: 12px 8px; font-size: 13px; margin: 0; }
button:focus-visible, a:focus-visible { outline: 2px solid var(--blue); outline-offset: 2px; }
.field input::placeholder, .field textarea::placeholder, .deal input::placeholder { color: #a9adb3; font-style: italic; }
.tab { text-decoration: none; }
.summary .steps { margin: 0 0 12px; padding: 10px 0 0; border-top: 1px solid var(--line); }
.steps__title { margin: 0 0 6px; font-size: 12.5px; font-weight: 600; color: var(--ink); }
.steps__list { list-style: none; margin: 0; padding: 0; }
.steps__list button { display: flex; gap: 8px; align-items: center; width: 100%; border: 0; background: none; padding: 4px 2px; font: inherit; font-size: 13px; color: var(--ink); text-align: left; cursor: pointer; border-radius: 4px; }
.steps__list button:hover { background: var(--paper); }
.steps__list i { flex: none; display: grid; place-items: center; width: 16px; height: 16px; border: 1.5px solid var(--ice); border-radius: 50%; font-style: normal; font-size: 10px; font-weight: 700; color: var(--white); }
.steps__list .is-done { color: #6b7076; }
.steps__list .is-done i { background: #1f7a3d; border-color: #1f7a3d; }
.steps__list small { color: var(--danger); font-size: 11.5px; }
.btn-ghost {
  border: 1px dashed var(--ice); background: transparent; border-radius: 8px; cursor: pointer;
  padding: 9px 14px; color: var(--ink); font-size: 13px; margin-top: 12px;
}
.btn-ghost:hover { border-color: var(--blue); color: var(--blue); }
.btn-ghost.small { border: 0; width: 100%; color: var(--silver); font-size: 12px; margin-top: 8px; }
#view-settings .btn { width: auto; margin-top: 20px; }
.saved { margin-left: 12px; color: var(--blue); font-size: 13px; }

/* ---------- итоговая панель ---------- */
.summary { position: sticky; top: 76px; }
.summary__inner { background: var(--white); border-radius: var(--radius); padding: 22px 22px 18px; box-shadow: 0 1px 2px rgb(54 61 74 / 6%); position: relative; overflow: hidden; }
.summary__bar { position: absolute; top: 0; left: 30%; right: 0; height: 4px; background: var(--yellow); }
.summary h3 { margin: 4px 0 14px; font-size: 16px; font-weight: 600; }
.summary__items { list-style: none; margin: 0 0 14px; padding: 0; font-size: 12.5px; display: flex; flex-direction: column; gap: 6px; max-height: 240px; overflow-y: auto; }
.summary__items li { display: flex; justify-content: space-between; gap: 10px; }
.summary__items li span:last-child { white-space: nowrap; color: var(--silver); }
.summary__items .none { color: var(--silver); }
.summary__totals { margin: 0 0 16px; border-top: 1px solid var(--line); padding-top: 12px; }
.summary__totals div { display: flex; justify-content: space-between; padding: 4px 0; font-size: 13px; }
.summary__totals dt { color: var(--silver); }
.summary__totals dd { margin: 0; font-variant-numeric: tabular-nums; }
.summary__totals .total { padding-top: 10px; margin-top: 6px; border-top: 1px solid var(--line); }
.summary__totals .total dt { color: var(--ink); font-weight: 600; }
.summary__totals .total dd { color: var(--blue); font-weight: 700; font-size: 18px; }
.summary__warn { font-size: 12px; color: #8a6d00; background: #fdf8dc; border-radius: 6px; padding: 8px 10px; margin: 0 0 12px; line-height: 1.4; }

/* ---------- история ---------- */
.history td { font-size: 13px; }
.history td.models { color: var(--silver); max-width: 260px; }
.history a, .link { color: var(--blue); font-weight: 500; text-decoration: none; cursor: pointer; background: none; border: 0; padding: 0 0 0 10px; font-size: 13px; white-space: nowrap; }
.history a:hover, .link:hover { text-decoration: underline; }

/* ---------- карточка модели ---------- */
.dialog { border: 0; border-radius: 12px; padding: 0; width: min(920px, calc(100vw - 32px)); max-height: calc(100vh - 48px); color: var(--ink); }
.dialog::backdrop { background: rgb(30 35 44 / 55%); }
.dialog__close { position: absolute; top: 12px; right: 12px; border: 0; background: var(--paper); width: 32px; height: 32px; border-radius: 50%; cursor: pointer; z-index: 2; }
.detail { display: grid; grid-template-columns: 1.1fr 1fr; gap: 0; }
.detail__media { background: var(--paper); padding: 16px; display: flex; flex-direction: column; gap: 10px; }
.detail__media img { width: 100%; border-radius: 8px; display: block; }
.detail__thumbs { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }
.detail__thumbs img { aspect-ratio: 4/3; object-fit: cover; cursor: pointer; border-radius: 5px; }
.detail__drawings { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.detail__drawings img { background: var(--white); }
.detail__body { padding: 26px 26px 22px; overflow-y: auto; max-height: calc(100vh - 48px); }
.detail__cat { font-size: 11.5px; color: var(--silver); }
.detail h3 { margin: 4px 0 2px; font-size: 26px; }
.detail__type { color: var(--silver); font-size: 13px; margin-bottom: 14px; }
.detail__keys { display: flex; gap: 22px; margin-bottom: 14px; }
.detail__keys b { display: block; color: var(--blue); font-size: 20px; }
.detail__keys span { font-size: 11px; color: var(--silver); }
.detail h4 { font-size: 13px; margin: 16px 0 6px; }
.detail ul { margin: 0; padding-left: 16px; font-size: 12.5px; line-height: 1.55; }
.detail dl { margin: 0; font-size: 12.5px; }
.detail dl div { display: flex; justify-content: space-between; gap: 10px; border-bottom: 1px solid var(--line); padding: 4px 0; }
.detail dl dd { margin: 0; font-weight: 600; text-align: right; }
.detail__actions { display: flex; gap: 10px; margin-top: 18px; align-items: center; }
.detail__actions .btn { width: auto; }

.toast {
  position: fixed; bottom: 24px; left: 50%; transform: translateX(-50%); z-index: 50;
  background: var(--ink); color: var(--white); padding: 12px 18px; border-radius: 8px; font-size: 13px;
  box-shadow: 0 6px 24px rgb(0 0 0 / 25%);
}
.toast.error { background: var(--danger); }

@media (max-width: 1100px) {
  .layout { grid-template-columns: 1fr; }
  .summary { position: static; }
}
@media (max-width: 720px) {
  .view { padding: 16px 16px 40px; }
  .topbar { padding: 10px 16px; flex-wrap: wrap; }
  .topbar__title { display: none; }
  .grid--2, .grid--3, .manager-row { grid-template-columns: 1fr; }
  .select { min-width: 0; width: 100%; }
  .span-2, .span-3 { grid-column: auto; }
  .search { width: 100%; margin-left: 0; }
  .detail { grid-template-columns: 1fr; }
}

/* ---------- цены из прайса / под заказ ---------- */
.segmented--right { margin: 0 0 0 auto; }
.notice { font-size: 12.5px; line-height: 1.5; background: #f4f7fc; border-left: 3px solid var(--blue); border-radius: 6px; padding: 10px 14px; margin-bottom: 12px; }
.tag-on-request, .product__price.on-request { color: #8a6d00; background: #fdf3c4; border-radius: 4px; padding: 1px 6px; font-weight: 600; font-size: 11.5px; }
.product__price { margin-top: 5px; font-weight: 700; color: var(--blue); font-size: 13.5px; }
.product__price small { font-weight: 500; color: var(--silver); font-size: 11px; }
.product__price.on-request { display: inline-block; width: fit-content; }
.product__variant { font-weight: 600; font-size: 12px; color: var(--white); background: var(--ink); border-radius: 4px; padding: 1px 6px; vertical-align: 2px; }
.lines .name small.list-price { color: var(--blue); }
.lines .name small.on-request { color: #8a6d00; font-weight: 500; }
.detail__actions { flex-wrap: wrap; }
.btn--on { background: var(--ink); }

/* ---------- сделка Битрикс, прайс ---------- */
.deal { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; border-top: 1px solid var(--line); padding: 12px 0 8px; margin-top: 4px; }
.deal label { font-size: 13px; font-weight: 600; }
.deal input { width: 150px; border: 1px solid var(--line); border-radius: 7px; padding: 8px 10px; font-weight: 600; }
.deal input:focus { outline: none; border-color: var(--blue); box-shadow: 0 0 0 3px rgb(27 70 140 / 12%); }
.deal .hint.ok { color: #2e7d32; }
.deal .hint.err { color: var(--danger); }
.btn.btn--small { width: auto; padding: 9px 16px; font-size: 13px; }
.btn--outline { background: transparent; color: var(--blue); border: 1.5px solid var(--blue); }
.btn--outline:hover { background: #eef3fb; }
.btn--reset { margin-top: 18px; background: var(--yellow); color: var(--ink); font-size: 15px; padding: 15px 18px; }
.btn--reset:hover { background: #e8d44f; }
#send { margin-top: 8px; }
.send { width: min(640px, calc(100vw - 32px)); }
.send__body { padding: 22px 24px; display: flex; flex-direction: column; gap: 8px; }
.send__body h3 { margin: 0; }
.send__body h4 { margin: 12px 0 2px; font-size: 14px; }
.send__body .hint { margin: 0; }
.send__row { display: flex; gap: 8px; align-items: center; font-size: 14px; cursor: pointer; }
.send__row small { color: var(--silver); }
.send__row.is-off { opacity: .5; cursor: default; }
.send__channels { display: flex; gap: 18px; flex-wrap: wrap; }
.send__add { display: flex; gap: 8px; }
.send__add input { flex: 1; }
.send__warn { margin: 0; padding: 8px 10px; border-radius: 6px; background: #fbf6dc; font-size: 13px; }
small.sent { display: block; color: var(--silver); font-size: 11px; }
.preview__note, .send__note { margin: 0; font-size: 13px; line-height: 1.4; color: #8a6d00; background: #fdf8dc; }
.preview__note { padding: 8px 20px; }
.send__note { padding: 8px 10px; border-radius: 6px; }
.send__res { font-size: 14px; }
.send__res.ok { color: #1f7a3d; }
.send__res.err { color: var(--danger); }
.send__chat { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; font-size: 13px; margin-top: 4px; }
.send__chat a { text-decoration: none; }
.reset-hint { margin: 6px 0 0; text-align: center; font-size: 12px; color: var(--silver); }
.upload { cursor: pointer; }
.prices-controls { display: flex; align-items: flex-end; gap: 12px; flex-wrap: wrap; margin-bottom: 8px; }
.markup { display: inline-flex; align-items: center; gap: 6px; font-size: 18px; font-weight: 600; }
.markup input { width: 90px; border: 1px solid var(--line); border-radius: 7px; padding: 8px 10px; font-size: 15px; font-weight: 600; }
.price-table td { font-size: 13px; }
.price-table td.r { font-variant-numeric: tabular-nums; white-space: nowrap; }
#view-settings .card + .card { margin-top: 18px; }
.prices-controls .btn, .deal .btn { margin-top: 0 !important; }

/* ---------- вход в настройки ---------- */
.dialog--small { width: min(360px, calc(100vw - 32px)); }
.login { padding: 24px; display: flex; flex-direction: column; gap: 10px; }
.login h3 { margin: 0; font-size: 18px; }
.login input { border: 1px solid var(--line); border-radius: 7px; padding: 10px 12px; font-size: 15px; }
.login input:focus { outline: none; border-color: var(--blue); box-shadow: 0 0 0 3px rgb(27 70 140 / 12%); }
.login__error { margin: 0; color: var(--danger); font-size: 13px; }
.login__actions { display: flex; gap: 10px; align-items: center; }
.login__actions .btn-ghost.small { width: auto; margin: 0; }
.card__head .logout { width: auto; margin: 0 0 0 auto; }

/* ---------- переключатель направлений ---------- */
.dir-switch { display: inline-flex; gap: 2px; padding: 3px; border-radius: 8px; background: rgb(255 255 255 / 8%); }
.dir-switch a { color: var(--ice); text-decoration: none; font-size: 13px; font-weight: 500; padding: 6px 12px; border-radius: 6px; white-space: nowrap; }
.dir-switch a:hover { color: var(--white); }
.dir-switch a.is-active { background: var(--white); color: var(--ink); }

/* ---------- оборудование ГидроКуб ---------- */
.chip:disabled { opacity: .55; cursor: default; }
.calc-box { background: #f8f9fa; border: 1px solid var(--line); border-radius: 9px; padding: 14px 16px; margin-bottom: 16px; }
.preview__pdf { display: block; width: 100%; height: 100%; border: 0; }
.preview__body { display: flex; min-height: 0; }
.preview__doc { flex: 1; min-width: 0; min-height: 0; }
.preview__doc:has(.docx-wrapper) { height: auto; }
.schedule { display: grid; grid-template-columns: repeat(2, minmax(0, 220px)); gap: 10px; margin-bottom: 6px; }
.schedule label { display: flex; flex-direction: column; justify-content: space-between; gap: 4px; font-size: 12px; color: var(--ink); }
.schedule-row { margin-bottom: 8px; font-size: 13px; }
.schedule input { width: 100%; color: var(--ink); font-weight: 600; text-align: left; }
.calc-box textarea { font-size: 12.5px; min-height: 420px; resize: vertical; }
.calc-box__actions { display: flex; gap: 10px; margin-top: 10px; flex-wrap: wrap; }
.eq-items { display: flex; flex-direction: column; gap: 14px; }
.eq-item { display: grid; grid-template-columns: 210px minmax(0, 1fr); gap: 18px; border: 1.5px solid var(--line); border-radius: 10px; padding: 14px; }
.eq-item--plain { grid-template-columns: minmax(0, 1fr); }
.eq-item.has-issues { border-color: #e9cf5a; }
.eq-item__media { display: flex; flex-direction: column; gap: 6px; }
.eq-item__media img { width: 100%; aspect-ratio: 4 / 3; object-fit: contain; background: var(--white); border-radius: 6px; }
.eq-item__media .btn-ghost { margin-top: 0; font-size: 12px; }
.eq-item__noimg { aspect-ratio: 4 / 3; display: grid; place-items: center; background: #fdf8dc; color: #8a6d00; border-radius: 6px; font-size: 12px; }
.eq-item__head { display: flex; gap: 8px; align-items: center; }
.eq-item__letter { font-weight: 600; color: var(--silver); }
.eq-title { flex: 1; border: 1px solid transparent; border-radius: 6px; padding: 6px 8px; font-weight: 600; font-size: 14.5px; }
.eq-title:hover, .eq-title:focus { border-color: var(--line); outline: none; }
.eq-label { width: 100%; border: 1px solid transparent; border-radius: 6px; padding: 2px 8px 6px; font-size: 13px; color: var(--ink); }
.eq-label:hover, .eq-label:focus { border-color: var(--line); outline: none; }
.eq-label:placeholder-shown { color: var(--silver); }
.eq-issues { margin: 8px 0 0; padding: 8px 10px 8px 26px; background: #fdf8dc; border-radius: 6px; color: #7a5f00; font-size: 12.5px; line-height: 1.45; }
.eq-price { display: flex; flex-wrap: wrap; gap: 8px 14px; align-items: center; margin: 10px 0; font-size: 12.5px; color: var(--silver); }
.eq-price label { display: inline-flex; align-items: center; gap: 6px; }
.eq-price input.num { width: 70px; border: 1px solid var(--line); border-radius: 6px; padding: 6px 8px; text-align: right; color: var(--ink); }
.eq-price input.price { width: 145px; font-weight: 600; }
.eq-price input:disabled { background: var(--paper); }
.eq-cost { flex-basis: 100%; color: var(--ink); background: #f4f7fc; border-radius: 6px; padding: 6px 10px; }
.eq-cost small { color: var(--silver); }
.eq-cost--none { background: #fdf8dc; color: #7a5f00; }
.eq-price__src { font-size: 11.5px; color: var(--ice); }
.eq-rows td { padding: 2px 4px 2px 0; border: 0; }
.eq-rows td:first-child { width: 42%; }
.eq-rows td:last-child { width: 30px; }
.eq-rows input { width: 100%; border: 1px solid var(--line); border-radius: 6px; padding: 6px 8px; font-size: 12.5px; }
.eq-rows td:nth-child(2) input { font-weight: 600; }
.eq-rows tr.is-empty td:nth-child(2) input { border-color: #e9cf5a; background: #fdfaea; }
.eq-add-row { width: auto !important; text-align: left; margin: 4px 0 8px !important; }
.eq-item .field { margin-top: 8px; }
.eq-extras tr.is-off td { color: var(--silver); }
.eq-extras tr.is-off input:not([type=checkbox]) { opacity: .6; }
.eq-extras td:nth-child(2) input { width: 100%; }
.picker { padding: 22px 24px 24px; }
.picker h3 { margin: 0 0 14px; font-size: 18px; }
.picker__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 10px; max-height: 62vh; overflow-y: auto; padding: 2px; }
.pick { position: relative; display: flex; flex-direction: column; gap: 6px; text-align: left; border: 1.5px solid var(--line); border-radius: 9px; background: var(--white); padding: 8px; cursor: pointer; font-size: 11.5px; line-height: 1.35; }
.pick:hover { border-color: var(--ice); box-shadow: 0 4px 14px rgb(54 61 74 / 10%); }
.pick img { width: 100%; aspect-ratio: 4 / 3; object-fit: contain; }
.pick.is-selected { border-color: var(--blue); box-shadow: 0 0 0 2px rgb(27 70 140 / 18%); }
.pick em { position: absolute; top: 6px; left: 6px; font-style: normal; font-size: 10.5px; font-weight: 600; background: var(--blue); color: var(--white); border-radius: 4px; padding: 2px 6px; }
@media (max-width: 720px) {
  .eq-item { grid-template-columns: 1fr; }
  .dir-switch a { padding: 6px 8px; font-size: 12px; }
}
#view-settings .notice + .card__head, #view-settings .grid + .card__head, #es-types .card__head, #es-types + .card__head { margin-top: 26px; }
#view-settings .notice a { color: var(--blue); font-weight: 500; }
.types-row { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.types-row .chips { margin-bottom: 12px; }
.eq-hints { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-top: 6px; }
.eq-hints .chip { padding: 4px 10px; font-size: 12px; }

/* ---------- предпросмотр КП ---------- */
#preview { margin-bottom: 8px; }
.preview { width: min(980px, calc(100vw - 24px)); height: calc(100vh - 40px); max-height: none; display: none; flex-direction: column; background: #e9ebee; }
.preview[open] { display: flex; }
.preview__head { display: flex; gap: 12px; align-items: baseline; flex-wrap: wrap; padding: 14px 56px 10px 20px; background: var(--white); border-bottom: 1px solid var(--line); }
.preview__body { flex: 1; overflow: auto; }
.preview__doc .docx-wrapper { background: #e9ebee; padding: 20px 0; }
.preview__doc .docx-wrapper > section.docx { box-shadow: 0 2px 10px rgb(0 0 0 / 15%); margin-bottom: 20px; }
.preview__wait { padding: 40px; text-align: center; color: var(--silver); }
.preview__wait.err { color: var(--danger); }

/* Исполнение «под заказ» со своими параметрами (платформа свыше 3 т): менеджер вписывает грузоподъёмность и диаметр. */
.line-params { display: flex; gap: 8px; margin: 6px 0 4px; }
.line-params label { display: flex; flex-direction: column; gap: 2px; font-size: 11px; color: var(--silver); flex: 1; }
.line-params input { width: 100%; }

/* Расчёты конструкторов */
.calcs { border-left: 4px solid var(--yellow); }
.calcs__list { list-style: none; margin: 0 0 10px; padding: 0; display: grid; gap: 8px; }
.calcs__item { display: flex; gap: 12px; align-items: center; justify-content: space-between; flex-wrap: wrap; }
.calcs__item > div { min-width: 0; flex: 1 1 260px; }
.calcs__item b { display: block; }
.calc-comment { margin: 0 0 12px; padding: 8px 10px; font-size: 13px; color: #8a6d00; background: #fdf8dc; border-radius: 6px; }
.cons-login { display: flex; gap: 12px; align-items: flex-end; flex-wrap: wrap; }
.cons-login .field { flex: 0 1 320px; }
.cons-login .login__error { flex-basis: 100%; }
.cons-form { display: grid; gap: 14px; }
.cons-actions { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.cons-check { margin-top: 16px; padding: 12px 14px; background: #f3f4f5; border-radius: 8px; font-size: 14px; }
.cons-check h3 { margin: 0 0 6px; font-size: 14px; }
.cons-check ul { margin: 0 0 8px; padding-left: 18px; }
.cons-row-actions { white-space: nowrap; width: 1%; }
.cons-text pre { margin: 0; max-height: 320px; overflow: auto; white-space: pre-wrap; font: 13px/1.45 var(--mono, Menlo, Consolas, monospace); }

/* Инструкция внутри приложения */
.view--help { padding: 0; max-width: none; }
.help-frame { display: block; width: 100%; height: calc(100vh - 56px); height: calc(100dvh - 56px); border: 0; }

/* Учётные записи конструкторов */
.cons-accounts { display: grid; gap: 8px; margin: 12px 0 8px; }
.cons-account { display: grid; grid-template-columns: 2fr 1fr 1.2fr auto; gap: 8px; align-items: center; }
.cons-account input { min-width: 0; width: 100%; border: 1px solid var(--line); border-radius: 6px; padding: 8px 10px; font: inherit; font-size: 14px; }
@media (max-width: 640px) { .cons-account { grid-template-columns: 1fr; } }
.cons-who { color: var(--white); font-size: 13px; padding: 0 8px; align-self: center; }
.cons-deal { max-width: 320px; }
.cons-login__hint { flex-basis: 100%; margin: 0; }

/* Вкладка конструкторов: форма слева, итог и кнопка отправки справа */
.cons-layout { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 20px; align-items: start; max-width: 1240px; margin: 0 auto; }
.cons-layout[hidden] { display: none; }
.cons-head { justify-content: space-between; }
.cons-side { position: sticky; top: 16px; display: grid; gap: 10px; padding: 20px; background: var(--white); border-radius: 12px; font-size: 14px; }
.cons-side h2 { margin: 0; font-size: 16px; font-weight: 600; }
.cons-side h3 { margin: 8px 0 4px; font-size: 13px; font-weight: 600; }
.cons-side ul { margin: 0; padding-left: 18px; display: grid; gap: 4px; overflow-wrap: anywhere; }
.cons-side .btn { width: 100%; margin: 0; }
.cons-side .btn:disabled { opacity: .45; cursor: not-allowed; }
.cons-issues { color: #8a6d00; }
.cons-deal-info { margin: 0; font-size: 13px; }
.cons-deal-info:empty, .cons-need:empty { display: none; }
.cons-need { margin: 0; font-size: 13px; color: var(--silver); }
.cons-bad { margin: 0; color: var(--danger); }
.cons-done { padding: 10px 12px; font-size: 13px; color: #1f7a3d; background: #e9f6ee; border-radius: 6px; }
.cons-refresh { margin-left: auto; }
.tabs [hidden] { display: none; }
@media (max-width: 900px) {
  .cons-layout { grid-template-columns: minmax(0, 1fr); }
  .cons-side { position: static; }
}
.cons-head .btn-ghost.small, .btn-ghost.small.cons-refresh { width: auto; margin: 0 0 0 auto; color: var(--blue); font-weight: 500; }
.cons-row-actions .btn-ghost.small { display: block; width: auto; margin: 0 0 4px; padding: 2px 0; color: var(--blue); font-weight: 500; }
#page-list.card.wide { max-width: 1320px; }
@media (max-width: 900px) { .tabs { flex-wrap: wrap; } }

/* Причина задержки у менеджера */
.calcs__actions { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.calcs__hold { max-width: 220px; }
#mark-sent { margin-top: 4px; }

/* Кабинет руководителя */
.boss { max-width: 1320px; }
.boss-bar { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; flex-wrap: wrap; margin-bottom: 6px; }
.boss-bar h1 { margin: 0; font-size: 26px; font-weight: 700; }
.boss-back.btn-ghost.small { display: block; width: auto; margin: 0 0 4px; padding: 0; color: var(--blue); }
.boss-note { margin: 0 0 16px; }
.boss-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 12px; margin-bottom: 18px; }
.boss-tile { display: grid; gap: 4px; align-content: start; padding: 14px 16px; background: var(--white); border-radius: 12px; }
.boss-tile span { font-size: 12px; color: var(--silver); font-weight: 500; }
.boss-tile b { font-size: 26px; font-weight: 700; font-variant-numeric: tabular-nums; line-height: 1.15; overflow-wrap: anywhere; }
.boss-tile em { font-style: normal; font-size: 11.5px; color: var(--silver); min-height: 1.3em; }
.boss-card { margin-bottom: 18px; min-width: 0; }
.boss-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(380px, 1fr)); gap: 18px; align-items: start; }
.boss-grid .boss-card { margin-bottom: 0; }
.boss-sub { margin: 18px 0 8px; font-size: 14px; font-weight: 600; }
.boss-empty { margin: 0; color: var(--silver); font-size: 14px; }
.boss-age { font-variant-numeric: tabular-nums; white-space: nowrap; font-weight: 500; }
.boss-age--warn { color: #8a6d00; }
.boss-age--bad { color: var(--danger); font-weight: 600; }
.boss-managers tbody tr { cursor: pointer; }
.boss-managers tbody tr:hover { background: #f3f4f5; }
.boss td.r, .boss th.r { text-align: right; font-variant-numeric: tabular-nums; }
.boss-chart { position: relative; }
.boss-chart__max { position: absolute; left: 0; top: 0; font-size: 11px; color: var(--silver); }
.boss-bars { display: flex; align-items: flex-end; gap: 2px; height: 170px; padding-top: 20px; border-bottom: 1px solid var(--line); }
.boss-bar-col { position: relative; flex: 1 1 0; height: 100%; display: flex; align-items: flex-end; justify-content: center; min-width: 0; }
.boss-bar-col i { display: block; width: min(100%, 26px); min-height: 2px; background: var(--blue); border-radius: 4px 4px 0 0; }
.boss-bar-col:hover i, .boss-bar-col:focus i { background: #2c5fb5; }
.boss-bar-value { position: absolute; left: 0; right: 0; bottom: 100%; text-align: center; font-size: 12px; font-weight: 600; }
.boss-bar-col:last-child .boss-bar-value { bottom: auto; top: -16px; }
.boss-axis { display: flex; justify-content: space-between; margin-top: 4px; font-size: 11px; color: var(--silver); }
.boss-table-view { margin-top: 10px; font-size: 13px; }
.boss-table-view summary { cursor: pointer; color: var(--blue); font-weight: 500; }
.boss-funnel { display: grid; gap: 8px; }
.boss-funnel__row { display: grid; grid-template-columns: 150px minmax(0, 1fr) 36px 40px; gap: 10px; align-items: center; font-size: 13px; }
.boss-funnel__row b { text-align: right; font-variant-numeric: tabular-nums; }
.boss-funnel__row em { font-style: normal; color: var(--silver); text-align: right; font-size: 12px; }
.boss-funnel__track { height: 14px; background: #eef0f2; border-radius: 0 4px 4px 0; overflow: hidden; }
.boss-funnel__track i { display: block; height: 100%; min-width: 2px; background: var(--blue); border-radius: 0 4px 4px 0; }
.boss-tip { position: fixed; z-index: 50; padding: 6px 10px; font-size: 12px; color: var(--white); background: var(--ink); border-radius: 6px; pointer-events: none; }
@media (max-width: 480px) { .boss-grid { grid-template-columns: minmax(0, 1fr); } .boss-funnel__row { grid-template-columns: 110px minmax(0, 1fr) 30px 36px; } }
.boss .link { padding: 0; }
.boss-view.btn-ghost.small { width: auto; margin: 0 0 0 8px; padding: 0; color: var(--blue); font-weight: 500; text-align: left; }
.calcs__wait { font-size: 12px; font-weight: 600; color: #8a6d00; }
.pay-sums { display: flex; gap: 8px; align-items: baseline; flex-wrap: wrap; font-size: 13px; font-weight: 500; cursor: pointer; }
.pay-sums em { font-style: normal; font-weight: 400; color: var(--silver); font-size: 12px; }

/* Вид предложения: окончательное или варианты на выбор */
.kp-mode { display: grid; gap: 6px; margin-bottom: 16px; padding: 12px 14px; background: #f3f4f5; border-radius: 8px; }
.kp-mode__label { font-size: 11.5px; font-weight: 500; color: var(--silver); }
.kp-mode .segmented { justify-self: start; }
.kp-mode__hint { margin: 0; font-size: 13px; line-height: 1.45; color: var(--ink); }
.kp-mode__nudge { display: block; margin-top: 4px; color: #8a6d00; }
.cons-dir { justify-self: start; }
.cons-form > .field > .segmented { width: fit-content; }

/* Страница входа и вид глазами менеджера */
.login-page { display: grid; place-items: center; min-height: 100vh; min-height: 100dvh; padding: 16px; }
.login-card { display: grid; gap: 14px; width: min(380px, 100%); }
.login-card h1 { margin: 0; font-size: 22px; font-weight: 700; }
.login-card .hint { margin: 0; line-height: 1.45; }
.login-form { display: grid; gap: 12px; }
.view-as { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; padding: 8px 28px; background: var(--yellow); font-size: 13px; font-weight: 500; }
.view-as button { border: 1px solid var(--ink); border-radius: 6px; background: transparent; padding: 6px 12px; font-size: 13px; font-weight: 600; cursor: pointer; }
#manager-locked { font-size: 15px; font-weight: 600; }
.access-sub { margin: 14px 0 4px; font-size: 14px; font-weight: 600; }
.only-phone { display: none; }
.send__add input { border: 1px solid var(--line); border-radius: 7px; background: var(--white); padding: 8px 10px; }

@media (max-width: 1320px) { .topbar { flex-wrap: wrap; } }

/* ---------- телефон ---------- */
@media (max-width: 720px) {
  .only-wide { display: none; }
  .only-phone { display: inline; }
  /* Поле ввода мельче 16px телефон увеличивает при каждом нажатии. */
  input:not([type=checkbox]), textarea, select { font-size: 16px !important; }
  input[type=checkbox] { width: 20px; height: 20px; flex: none; }

  .topbar { position: static; gap: 8px; padding: 10px 12px 6px; }
  .topbar__brand { justify-content: space-between; width: 100%; min-width: 0; gap: 10px; }
  .dir-switch a { padding: 8px 12px; font-size: 13px; }
  /* Вкладки в одну строку: те, что не вошли, листаются пальцем. */
  .tabs { flex-wrap: nowrap; width: calc(100% + 24px); margin: 0 -12px; padding: 0 12px 4px; overflow-x: auto; scrollbar-width: none; }
  .tabs::-webkit-scrollbar { display: none; }
  .tab { flex: none; padding: 9px 11px; white-space: nowrap; }
  .cons-who { flex: none; white-space: nowrap; }
  .view-as { padding: 8px 12px; }

  .view { padding: 12px 12px 32px; }
  .view--help { padding: 0; }
  .card { padding: 16px 14px; }
  .help-frame { height: calc(100vh - 100px); height: calc(100dvh - 100px); }
  .segmented { display: flex; width: 100%; }
  .segmented button { flex: 1 1 0; padding: 9px 6px; }
  .segmented--right { margin: 0; }
  .btn-ghost { padding: 11px 14px; }
  .btn-ghost.small { padding: 10px 8px; font-size: 13px; }
  .chip { padding: 8px 13px; }
  .deal input { flex: 1 1 130px; width: auto; min-width: 0; }
  .toast { left: 12px; right: 12px; bottom: 12px; transform: none; }

  .products { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; max-height: 62vh; }
  .product__info { padding: 6px 9px; }
  .calc-box { padding: 12px; }
  .calc-box textarea { min-height: 240px; }
  .calcs__item > div { flex-basis: 100%; }
  .calcs__actions, .calcs__hold { width: 100%; max-width: none; }
  .calcs__actions .btn { flex: 1 1 auto; }
  .eq-title { min-width: 0; }
  .cons-deal { max-width: none; }
  .cons-form textarea#text { height: 260px; }

  /* Строки КП: на телефоне карточками, поля не прячутся за край. */
  .lines, .lines tbody { display: block; width: 100%; }
  .lines thead { display: none; }
  .lines tr { position: relative; display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 10px 8px; padding: 12px 0; border-bottom: 1px solid var(--line); }
  .lines td { display: block; grid-column: span 4; min-width: 0; padding: 0; border: 0; text-align: left; }
  .lines td::before { display: block; margin-bottom: 3px; font-size: 11px; font-weight: 500; color: var(--silver); }
  .lines td.name { grid-column: 1 / -1; min-width: 0; }
  .lines .name > small { padding-right: 34px; }
  .lines .name input { padding: 8px 10px; }
  .lines input.num, .lines input.price, .lines input.vat { width: 100%; text-align: left; }
  .lines td:has(input.num) { grid-column: span 3; }
  .lines td:has(input.price) { grid-column: span 6; }
  .lines td.money { white-space: normal; text-align: left; font-size: 12.5px; }
  .lines .remove { position: absolute; top: 8px; right: 0; width: 34px; height: 34px; padding: 0; }
  .lines td:has(.remove) { grid-column: auto; width: 0; height: 0; }
  #lines td:nth-child(2)::before { content: 'Кол-во'; }
  #lines td:nth-child(3)::before { content: 'Цена, ₽'; }
  #lines td:nth-child(4)::before { content: 'НДС, %'; }
  #lines td:nth-child(5)::before { content: 'Без НДС'; }
  #lines td:nth-child(6)::before { content: 'НДС'; }
  #lines td:nth-child(7)::before { content: 'С НДС'; }
  .eq-extras td:nth-child(1) { grid-column: span 1; align-self: center; }
  .eq-extras td:nth-child(2) { grid-column: span 10; padding-right: 26px; }
  .eq-extras td:nth-child(3)::before { content: 'Кол-во'; }
  .eq-extras td:nth-child(4)::before { content: 'Цена с НДС, ₽'; }
  .eq-extras td:nth-child(5)::before { content: 'НДС, %'; }
  .eq-extras td:nth-child(6) { grid-column: 1 / -1; }
  .eq-extras td:nth-child(6)::before { content: 'Сумма'; }

  /* Окна */
  .dialog { max-height: calc(100vh - 24px); max-height: calc(100dvh - 24px); }
  .dialog__close { width: 38px; height: 38px; }
  .detail__body { max-height: none; padding: 18px 16px; }
  .detail__keys { flex-wrap: wrap; gap: 12px 20px; }
  .send { width: calc(100vw - 16px); }
  .send__body { padding: 16px 14px; }
  .send__add input { min-width: 0; }
  .send__channels { gap: 10px 18px; }
  .picker { padding: 16px 14px; }
  .picker__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); max-height: 66vh; }
  .preview { width: 100vw; max-width: none; height: 100vh; height: 100dvh; max-height: none; margin: 0; border-radius: 0; }
  .preview__head { padding: 12px 56px 10px 14px; }
  .preview__wait { padding: 32px 16px; }
  .preview__wait p { margin: 0 0 16px; color: var(--ink); }
  .preview__wait .btn { text-decoration: none; }
  /* Запасной предпросмотр без PDF: лист А4 целиком по ширине экрана. */
  .preview__doc .docx-wrapper { zoom: .44; padding: 8px 0; }

  .boss-bar h1 { font-size: 22px; }
  .boss-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .boss-tile { padding: 12px; }
  .boss-tile b { font-size: 21px; }
  .boss-view.btn-ghost.small { display: block; margin: 6px 0 0; font-size: 13px; }
}
.boss-as { display: inline-block; margin-top: 10px; font-size: 13px; }

/* Опции к позиции */
.eq-addons { display: grid; gap: 6px; margin: 10px 0; padding: 10px 12px; background: #f3f4f5; border-radius: 8px; }
.eq-addons__title { font-size: 12px; font-weight: 500; color: var(--ink); }
.eq-addons__title em { font-style: normal; font-weight: 400; color: var(--silver); }
.eq-addon { display: grid; grid-template-columns: minmax(0, 1fr) 145px auto; gap: 8px; align-items: center; }
.eq-addon input { min-width: 0; width: 100%; border: 1px solid var(--line); border-radius: 6px; padding: 7px 9px; font: inherit; font-size: 14px; background: var(--white); }
.eq-addon input.price { text-align: right; font-weight: 600; }

/* Картинки к позиции: скриншот, файл или перетаскивание */
.own-pics { display: grid; gap: 8px; margin: 10px 0; padding: 10px 12px; background: #f3f4f5; border-radius: 8px; }
.own-pic { display: grid; grid-template-columns: 96px minmax(0, 1fr) auto; gap: 10px; align-items: center; }
.own-pic img { width: 96px; height: 64px; object-fit: contain; background: var(--white); border: 1px solid var(--line); border-radius: 6px; }
.own-pic input { min-width: 0; width: 100%; border: 1px solid var(--line); border-radius: 6px; padding: 7px 9px; font: inherit; font-size: 14px; background: var(--white); }
.own-pics__drop { padding: 12px; border: 1.5px dashed var(--ice); border-radius: 8px; background: var(--white); color: var(--silver); font-size: 13px; line-height: 1.6; cursor: pointer; }
.own-pics__drop:focus, .own-pics__drop.is-over { outline: none; border-color: var(--blue); color: var(--ink); background: #f5f8fd; }
.own-pics__drop.is-busy { opacity: .6; pointer-events: none; }
.own-pics__drop .chip { margin-left: 2px; }
td.name .own-pics { margin: 8px 0 2px; }
td.name .own-pics .eq-addons__title em { display: none; }
td.name .own-pics__drop { padding: 8px 10px; font-size: 12px; line-height: 1.5; }
td.name .own-pic { grid-template-columns: 72px minmax(0, 1fr) auto; }
td.name .own-pic img { width: 72px; height: 48px; }
.eq-addons__add { display: flex; gap: 6px; flex-wrap: wrap; }
@media (max-width: 640px) { .eq-addon { grid-template-columns: minmax(0, 1fr) auto; } .eq-addon input[data-af="name"] { grid-column: 1 / -1; } }

/* Опции к каждому варианту */
.vo { display: grid; gap: 8px; padding: 12px 0; border-bottom: 1px solid var(--line); }
.vo:first-child { padding-top: 0; }
.vo:last-child { border-bottom: 0; }
.vo h3 { margin: 0; font-size: 14px; font-weight: 600; }
.vo .hint { margin: 0; }
.vo .lines { width: 100%; }
.vo .lines td:first-child { width: 100%; }
.vo .lines input[data-af="name"] { width: 100%; min-width: 180px; }

/* Выбор контакта сделки */
.contact-pick { padding: 20px; max-width: 460px; width: calc(100vw - 32px); }
.contact-pick h3 { margin: 0 0 4px; font-size: 16px; }
.contact-pick__list { display: grid; gap: 8px; margin-top: 12px; }
.contact-pick__item { display: grid; gap: 2px; padding: 10px 12px; text-align: left; background: var(--white); border: 1px solid var(--line); border-radius: 8px; font: inherit; font-size: 13px; color: var(--ink); cursor: pointer; }
.contact-pick__item:hover, .contact-pick__item:focus-visible { border-color: var(--blue); }
.contact-pick__item b { font-size: 14px; }
.contact-pick__item span { color: var(--silver); overflow-wrap: anywhere; }

/* Перед отправкой: записать ли товары КП в сделку */
.goods-ask { padding: 20px; max-width: 480px; width: calc(100vw - 32px); }
.goods-ask h3 { margin: 0 40px 6px 0; font-size: 16px; }
.goods-ask p { margin: 6px 0; }
.goods-ask .hint { overflow-wrap: anywhere; }
.goods-ask__btns { display: flex; flex-wrap: wrap; gap: 8px; margin: 14px 0 6px; }
.goods-ask__btns .btn:focus-visible { outline: 3px solid var(--blue); outline-offset: 2px; }