/* Остатки (спека 045): пять плиток-итогов, таблица по моделям, раскрытая модель по размерам и складам WB.
   Копия mockup/screens-stock.css; фото - класс st-photo-s станции (static/screens-station.css, просмотр - photo_view.js).
   Ниже общие fm-* из mockup/screens-future-marina.css, которые нужны этому экрану. */
.stk-tiles { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--sp-2); }
.stk-tile { display: flex; flex-direction: column; gap: 2px; padding: var(--sp-3); background: var(--surface); border-radius: var(--radius-card); box-shadow: var(--shadow-soft); min-width: 0; }
.stk-tile-name { font-family: var(--display); font-weight: 700; font-size: var(--fs-text); line-height: 1.2; }
.stk-tile-val { font-family: var(--display); font-weight: 700; font-size: 32px; line-height: 1.1; font-variant-numeric: tabular-nums lining-nums; }
.stk-tile-sub { font-size: var(--fs-caption); color: var(--ink-dim); }
.stk-tile:last-child { background: var(--surface-2); }
.stk-tile:last-child .stk-tile-sub { color: var(--ink); }
.stk-tile.is-stale { background: var(--surface-2); border: 2px dashed var(--line); }
.stk-tile.is-stale .stk-tile-sub { color: var(--ink); }

.stk-search { display: flex; align-items: flex-end; gap: var(--sp-3); max-width: 560px; }
.stk-search .field { flex: 1; }
.stk-search label { margin-bottom: var(--sp-1); }

.stk-card { padding: var(--sp-3); }
.stk-table th, .stk-sub th { vertical-align: bottom; line-height: 1.25; }
.stk-table th:first-child, .stk-table td:first-child { padding-left: 0; }
.stk-table .num { width: 1%; }
.stk-table > thead th, .stk-table > tbody > tr > td { padding-right: var(--sp-2); }
.stk-link { display: grid; grid-template-columns: 24px 56px auto; column-gap: 8px; align-items: center; justify-content: start; color: var(--ink); text-decoration: none; min-height: var(--target); }
.stk-txt { display: flex; flex-direction: column; min-width: 0; }
.stk-nodata { color: var(--ink-dim); font-weight: 700; cursor: help; border-bottom: 2px dotted var(--ink-dim); }
.stk-notes { padding: 0 var(--sp-2) var(--sp-1); }
.stk-wbbuy { display: flex; align-items: center; gap: var(--sp-2); margin: var(--sp-2); }
.stk-link:hover .stk-art { text-decoration: underline; }
.stk-chev { width: 20px; height: 20px; }
.stk-art { font-family: var(--display); font-weight: 700; font-size: 19px; }
.stk-model.is-open > td { background: var(--surface-2); }
.stk-detail > td { padding: var(--sp-2) 0 var(--sp-3); border-top: 0; }
.stk-sub { background: var(--surface); border-radius: var(--radius); }
.stk-sub th, .stk-sub td { padding-left: 6px; padding-right: 6px; font-size: var(--fs-caption); }
.stk-sub { table-layout: auto; }
.stk-sub .stk-wh { width: 1%; min-width: 74px; color: var(--ink-dim); overflow-wrap: normal; word-break: normal; }
.stk-sub th.stk-wh { font-size: var(--fs-caption); }
.stk-size { font-family: var(--display); font-weight: 700; white-space: nowrap; }
.stk-flag { display: inline-flex; align-items: center; gap: 4px; margin-left: 32px; font-size: var(--fs-caption); font-weight: 700; color: var(--danger-ink); }
.stk-sub .stk-flag { margin-left: var(--sp-2); }
.stk-zero { color: var(--ink-dim); }
.stk-table .is-stale, .stk-sub .is-stale { color: var(--ink-dim); font-style: italic; }
.stk-chev.is-shut { transform: rotate(-90deg); }

.stk-days { white-space: nowrap; }
.stk-days .fm-pill { margin-left: var(--sp-2); padding: 0 8px; }
.stk-sales { margin-top: var(--sp-2); }
.stk-sales caption { text-align: left; padding: var(--sp-1) var(--sp-2); caption-side: top; }
.stk-sales th.num, .stk-sales td.num { width: auto; }

/* Переключатель «Учитывать товар в пути»: ссылка, состояние в адресе; включён - рамка и ручка --amber-ink */
.stk-toggle { display: flex; align-items: center; flex-wrap: wrap; gap: var(--sp-2) var(--sp-4); }
.stk-switch { display: inline-flex; align-items: center; gap: var(--sp-2); min-height: var(--target); color: var(--ink); text-decoration: none; font-family: var(--display); font-weight: 700; }
.stk-knob { position: relative; width: 52px; height: 30px; flex: none; border-radius: 15px; border: 2px solid var(--line); background: var(--surface); }
.stk-knob::after { content: ""; position: absolute; top: 3px; left: 3px; width: 20px; height: 20px; border-radius: 50%; background: var(--ink-dim); }
.stk-switch[aria-checked="true"] .stk-knob { border-color: var(--amber-ink); background: var(--amber-ink); }
.stk-switch[aria-checked="true"] .stk-knob::after { left: 25px; background: var(--surface); }
.stk-stop { display: flex; align-items: center; gap: var(--sp-2); margin-top: 4px; }
.stk-stop .fm-pill { padding: 0 8px; }
.stk-card { overflow-x: auto; }
.stk-bar { display: flex; flex-wrap: wrap; align-items: flex-end; gap: var(--sp-3) var(--sp-5); }
.stk-bar .stk-search { flex: 0 1 520px; }
.stk-bar .fm-tabs { padding-bottom: 0; }


.stk-link .st-photo-s { flex: none; }
.stk-link { cursor: pointer; }
