/* Карточка товара (card.js, этап 2.4): окно, форма «Изменить», раздел «Настройки - Метки наличия»; название товара -
   кнопка у учетной записи (app.js). Цвет - только у меток и основной кнопки (решение 14 проекта этапа). */

/* название в строке каталога: кнопка без вида кнопки; на касание область нажатия не ниже 44 px (поля по высоте
   с отрицательными отступами: строка каталога не становится выше) */
.nm-b { display: block; max-width: 100%; margin: 0; padding: 0; border: 0; background: none; color: inherit; font: inherit;
  line-height: inherit; text-align: left; cursor: pointer; overflow-wrap: anywhere; }
.nm-b:hover { text-decoration: underline; text-decoration-color: var(--line-2); text-underline-offset: 3px; }
.nm-b:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: var(--r-xs); }
@media (pointer: coarse) { .nm-b { min-height: 44px; padding: 12px 0; margin: -12px 0; box-sizing: border-box; } }
/* название-кнопка карточки в разделе «Архив» (items.js) */
.it-open { padding: 0; border: 0; background: none; color: inherit; font: inherit; font-weight: 600; text-align: left; cursor: pointer; }
.it-open:hover { text-decoration: underline; text-underline-offset: 3px; }
.it-open:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: var(--r-xs); }

/* окно */
.cd { display: grid; gap: var(--s-8); min-width: 0; }
.cd p { margin: 0; }
.cd-wait { min-height: 220px; }
.cd-head { display: flex; gap: var(--s-6); align-items: flex-start; min-width: 0; }
.cd-ph { flex: none; display: block; width: 72px; height: 72px; overflow: hidden; border: 1px solid var(--line); border-radius: var(--r-lg);
  background: var(--surface-2); }
.cd-ph img { display: block; width: 100%; height: 100%; object-fit: cover; }
.cd-ph:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.cd-hd { display: grid; gap: var(--s-2); min-width: 0; }
.cd-meta { color: var(--text-2); font-size: var(--fs-sm); font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.cd-code { user-select: all; }
.cd-folder { color: var(--text-3); font-size: var(--fs-sm); overflow-wrap: anywhere; }
.cd-full { font-size: var(--fs-sm); }
.cd-sum { font-variant-numeric: tabular-nums; }
.cd-sum small { color: var(--text-3); font-size: var(--fs-xs); }
.cd-st { display: grid; gap: var(--s-1); font-size: var(--fs-sm); }
.cd-empty { overflow-wrap: anywhere; }
.cd-tags { display: flex; flex-wrap: wrap; gap: var(--s-2); }
.cd-acts { flex-wrap: wrap; }
.cd-narrow { display: none; }      /* «Изменить место хранения» на узком экране - «Место» (этап 4.2) */
@media (max-width: 760px) {
  .cd-acts .cd-wide { display: none; }
  .cd-acts .cd-narrow { display: inline; }
}
.cd-note { margin: 0; }
.cd-sec { display: grid; gap: var(--s-4); min-width: 0; }
.cd-sec h3 { margin: 0; font-size: var(--fs-lg); font-weight: 650; }
.cd-sec h3 small { display: block; margin-top: var(--s-1); color: var(--text-3); font-size: var(--fs-sm); font-weight: 400; }
.cd-sec h4 { margin: var(--s-2) 0 0; font-size: var(--fs-md); font-weight: 600; }
.cd-na { color: var(--text-3); font-style: italic; }
.cd-tab small { display: block; color: var(--text-3); font-size: var(--fs-xs); font-weight: 400; }
.cd-tab td.lead small { display: inline; margin-left: var(--s-2); }
.cd-tab .num small { display: block; }
.cd-tab .num small.cd-src { display: inline; margin-left: var(--s-1); }
.cd-tab .cd-tag { white-space: nowrap; }
/* перемещения (этап 5.4): «в пути» и «ожидается» по маршрутам - строками, метка «1С: N» - цветом заметки */
.cd-way { display: block; }
.cd-tab .num small.cd-1c { color: var(--st-warn); }
.cd-total td { background: var(--surface-2); font-weight: 600; }
.cd-tab tbody tr.cd-total:hover { background: var(--surface-2); }

/* продажи: месяцы, полоса количества (нейтральная), даты */
.cd-sales { display: grid; grid-template-columns: minmax(0, 1fr) minmax(200px, 260px); gap: var(--s-6); align-items: start; }
.cd-sold { background-image: linear-gradient(to left, var(--line-2) var(--w, 0%), transparent var(--w, 0%)); background-repeat: no-repeat;
  background-size: 100% 6px; background-position: 0 calc(100% - 4px); }
.cd-dates { display: grid; gap: var(--s-4); margin: 0; }
.cd-dates div { display: grid; gap: var(--s-1); }
.cd-dates dt { color: var(--text-3); font-size: var(--fs-xs); }
.cd-dates dd { margin: 0; font-weight: 600; font-variant-numeric: tabular-nums; }
.cd-in, .cd-out { font-weight: 600; }

/* штрихкоды, ссылки, подвал */
.cd-codes, .cd-links { display: grid; gap: var(--s-3); margin: 0; padding: 0; list-style: none; }
.cd-codes code { font-family: var(--mono); font-size: var(--fs-md); letter-spacing: .04em; }
.cd-codes small { color: var(--text-3); font-size: var(--fs-xs); }
.cd-link { display: flex; align-items: center; justify-content: space-between; gap: var(--s-3) var(--s-6); flex-wrap: wrap;
  padding: var(--s-4) var(--s-5); border: 1px solid var(--line); border-radius: var(--r-lg); }
.cd-link > div:first-child { display: grid; gap: var(--s-1); min-width: 0; }
.cd-link small { color: var(--text-3); font-size: var(--fs-xs); }
.cd-all { font-size: var(--fs-sm); }
.cd-foot { color: var(--text-3); font-size: var(--fs-xs); }

/* описание товара из 1С */
.cd-text { display: grid; gap: var(--s-3); font-size: var(--fs-sm); overflow-wrap: anywhere; }
.cd-text p, .cd-text ul { margin: 0; }
.cd-text ul { padding-left: 1.2em; }

/* «Изменить» и «Ссылка на товар»: поля приложения и поля 1С (без правки) - рамками */
.cd-dlg p { margin: 0; }
.cd-dlg .cd-h { margin: var(--s-2) 0 0; font-size: var(--fs-md); font-weight: 600; }
.cd-box { display: grid; gap: var(--s-3); padding: var(--s-4) var(--s-5); border: 1px solid var(--line); border-radius: var(--r-lg); min-width: 0; }
.cd-box h3 { margin: 0; font-size: var(--fs-md); font-weight: 600; }
.cd-box h3 small { margin-left: var(--s-2); color: var(--text-3); font-size: var(--fs-sm); font-weight: 400; }
.cd-ro { background: var(--surface-2); }
.cd-dl { display: grid; gap: var(--s-3); margin: 0; }
.cd-dl > div { display: grid; grid-template-columns: 9em minmax(0, 1fr); gap: var(--s-4); align-items: baseline; }
.cd-dl dt { color: var(--text-2); font-size: var(--fs-sm); }
.cd-dl dd { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-2) var(--s-4); min-width: 0; margin: 0; overflow-wrap: anywhere; }
.cd-ro .cd-text { display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
.cd-ro img { display: block; border: 1px solid var(--line); border-radius: var(--r-md); object-fit: cover; }
.cd-ed .ui-input.num { width: 8em; max-width: 100%; }
.cd-ed td .ui-input:not(.num) { width: 100%; min-width: 10em; margin-top: var(--s-2); }
.cd-ed td.lead span { display: block; }
.cd-chk { display: inline-flex; align-items: center; gap: var(--s-3); min-height: 32px; cursor: pointer; }
@media (hover: none) { .cd-dlg .ui-input, .cd-dlg .ui-select, .cd-set .ui-input { font-size: 16px; } }      /* касание: 16 px - страница не увеличивается при вводе */

/* этикетки: предпросмотр; выбор товара быстрых действий */
.cd-lbprev { display: block; width: 100%; height: 300px; border: 1px solid var(--line); border-radius: var(--r-lg); background: #e9ecf1; }
.cd-pick { display: grid; gap: var(--s-2); max-height: 50vh; overflow: auto; }
.cd-pk { display: grid; gap: var(--s-1); padding: var(--s-4) var(--s-5); border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--surface);
  color: var(--text); font: inherit; text-align: left; cursor: pointer; }
.cd-pk:hover { background: var(--hover); }
.cd-pk:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.cd-pk small { color: var(--text-3); font-size: var(--fs-xs); }
@media (max-width: 760px) { .cd-pk { min-height: 44px; } .cd-lbprev { height: 240px; } }

/* «Настройки - Метки наличия» */
.cd-set { display: grid; gap: var(--s-8); }
.cd-days { display: flex; align-items: center; gap: var(--s-4); flex-wrap: wrap; }
.cd-days .ui-input { width: 6em; }
.cd-rules h2 { margin: 0 0 var(--s-4); font-size: var(--fs-lg); }
.cd-rules ul { display: grid; gap: var(--s-4); margin: 0 0 var(--s-4); padding-left: 0; list-style: none; }
.cd-rules li .ui-tag { margin-right: var(--s-2); }

@media (max-width: 760px) {
  .cd { gap: var(--s-6); }
  .cd-ph { width: 56px; height: 56px; }
  .cd-sales { grid-template-columns: minmax(0, 1fr); }
  .cd-dl > div { grid-template-columns: minmax(0, 1fr); gap: var(--s-1); }
  /* кнопки окна (.ui-btn, .ui-btn.sm) не ниже 44 px - через токены --h-sm и --h-md ui.css на этой же ширине */
  .cd-chk { min-height: 44px; }
  .it-open { display: inline-flex; align-items: center; min-height: 44px; }      /* название-кнопка карточки в разделе «Архив» */
  .cd-tab td.lead small { display: block; margin-left: 0; }
  .cd-ed .ui-input.num { width: 100%; }
}
