/* Сайт «Склад и поставки», спека 023. Ширины, вход и роли, главная склада, экраны склада (v4).
   Файлы site*.css подключаются в base.html по порядку: порядок задаёт каскад. Цвета - только в :root из site.css. */

/* ---------- Ширины ---------- */

@media (max-width: 980px) {
  .layout { grid-template-columns: minmax(0, 1fr); }
  .side { position: static; height: auto; flex-direction: row; flex-wrap: wrap; align-items: flex-start; gap: 14px; padding: 14px var(--gap); border-right: 0; border-bottom: 1px solid var(--line); }
  .side nav { flex-basis: 100%; }
  .menu { flex-direction: row; flex-wrap: wrap; }
  .menu-title { display: none; }
  .side nav > div + div { margin-top: 0; }
  .side-foot { display: none; }
  .grid-2, .queue, .summary, .shelves-layout { grid-template-columns: 1fr; }
  .fbo-steps { grid-template-columns: 1fr 1fr; }
  .fields li { grid-template-columns: 1fr auto; }
  .fields .value { grid-column: 1; }
  .fields li > :last-child { grid-row: 1 / 3; grid-column: 2; }
}

@media (max-width: 620px) {
  .product-list li { grid-template-columns: 56px minmax(0, 1fr); }
  .product-list .photo { width: 56px; height: 56px; }
  .product-side { grid-column: 2; text-align: left; }
  .fbo-steps.three { grid-template-columns: 1fr; }
  :root { --gap: 16px; --text: 18px; --text-warehouse: 24px; }
  .card { padding: 18px; }
  .cabinet-bar .note { display: none; }
  .switcher a { padding: 8px 12px; font-size: 16px; }
  .switcher a small { display: none; }
  .warehouse .switcher a { font-size: 21px; padding: 10px 16px; }
  .station-top .inner { flex-wrap: wrap; }
  .station-buttons .inner { gap: 10px; }
  .station-buttons .btn { min-height: 64px; font-size: 19px; padding: 6px 10px; }
  .files-list li { grid-template-columns: 1fr; }
  .files-list .btn { grid-row: auto; grid-column: 1; }
  .table { font-size: 16px; }
  .table th:nth-child(3), .table td:nth-child(3) { display: none; }
  .table td, .table th { padding: 10px 6px; }
  .scan-zone { padding: 22px; }
  .scan-zone .say { font-size: 30px; }
  .scan-zone .what { font-size: 32px; }
  .item-card { grid-template-columns: 1fr; }
  .to-collect summary { grid-template-columns: 72px minmax(0, 1fr); }
  .to-collect .progress { grid-column: 2; text-align: left; }
  .to-collect .waits { grid-column: 2; }
  .to-collect .orders { padding-left: 0; }
  .order-line { grid-template-columns: 1fr; gap: 6px; }
  .fbo-steps { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}

/* Полки и Поставка FBO - экраны склада (решение Марины 15.10.2026): текст не меньше 20 px, как на станции */
body.warehouse-screen #app { font-size: 20px; }
body.warehouse-screen #app .lead { font-size: 22px; }
body.warehouse-screen #app .dim,
body.warehouse-screen #app p[style*="font-size:16px"],
body.warehouse-screen #app label[style*="font-size:16px"] { font-size: 20px !important; }
body.warehouse-screen #app .table { font-size: 20px; }
body.warehouse-screen #app .btn { min-height: 56px; font-size: 20px; }
body.warehouse-screen #app input { font-size: 22px; }
body.warehouse-screen #app .eyebrow { font-size: 16px; }
body.warehouse-screen #app label,
body.warehouse-screen #app small { font-size: 18px !important; }
body.warehouse-screen #app th { font-size: 16px; }

/* ---------- Вход, роли, главная склада (решение Марины 15.10.2026) ---------- */

.session { display: inline-flex; align-items: center; flex-wrap: wrap; gap: 4px 10px; font-size: 18px; color: var(--ink-dim); }

.session b { color: var(--ink); font-family: var(--display); font-weight: 600; }

.session .btn { min-height: 44px; padding: 6px 14px; font-size: 18px; border-color: var(--line-strong); }

.side .session { padding: 0 10px; font-size: 16px; }

.station-top .inner.stack { flex-direction: column; align-items: stretch; gap: 10px; }

.top-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 20px; }

.station-top .home-link { font-family: var(--display); font-weight: 600; font-size: 22px; color: var(--ink); }

.auth-page { max-width: 640px; padding-bottom: 80px; }

.auth label { display: block; margin-top: 18px; font-size: var(--text-warehouse); color: var(--ink-dim); }

.auth label:first-child { margin-top: 0; }

.auth .btn { width: 100%; margin-top: 22px; }

.auth .remember { display: flex; align-items: center; gap: 14px; cursor: pointer; }

.auth label.remember input[type="checkbox"] { display: inline-block; width: 32px; height: 32px; margin: 0; padding: 0; flex: none; accent-color: var(--ink); }

.auth .dim { margin-top: 16px; font-size: 20px; text-align: center; }

.auth-error {
  margin-top: 18px; padding: 12px 14px; border-left: 4px solid var(--amber-ink);
  background: var(--amber-soft); color: var(--ink); font-size: 22px;
}

.demo-hint { margin-top: 22px; font-size: 14px; color: var(--ink-faint); }

.tiles { list-style: none; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }

.tile {
  display: flex; flex-direction: column; justify-content: center; gap: 6px; min-height: 150px; height: 100%;
  padding: 22px 24px; text-decoration: none; color: var(--ink);
  background: var(--surface); border: 1px solid var(--line-strong); border-radius: var(--radius-card); box-shadow: var(--shadow);
}

.tile:hover { border-color: var(--ink-dim); }

.tile b { font-family: var(--display); font-weight: 600; font-size: 30px; line-height: 1.15; }

.tile span { font-size: 21px; color: var(--ink-dim); line-height: 1.35; }

.tile.main { background: var(--amber); border-color: var(--amber); }

.tile.main span { color: var(--ink); }

.tile.main:hover { border-color: var(--amber-ink); }

/* Люди и доступ */
.people { list-style: none; }

.people li {
  display: grid; grid-template-columns: 1.4fr .8fr .55fr 1.1fr .9fr 2.5fr; gap: 6px 14px; align-items: center;
  padding: 14px 0; border-bottom: 1px solid var(--line);
}

.people li.head {
  font-family: var(--mono); font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-faint);
  padding-top: 4px;
}

.people .name { font-family: var(--display); font-weight: 600; }

.people .actions-cell { display: flex; flex-wrap: wrap; gap: 4px; justify-content: flex-end; }

.people .actions-cell .btn { white-space: nowrap; padding: 6px 12px; min-height: 44px; font-size: 16px; }

.notice {
  margin-top: 14px; padding: 14px 16px; border: 1px solid var(--line-strong);
  border-radius: var(--radius-card); background: var(--surface-2);
}

@media (max-width: 980px) {
  .people li.head { display: none; }
  .people li { grid-template-columns: 1fr 1fr; }
  .people .name, .people .actions-cell { grid-column: 1 / -1; justify-content: flex-start; }
  .people .cell[data-label]::before {
    content: attr(data-label); display: block; font-family: var(--mono); font-size: 12px;
    letter-spacing: .1em; text-transform: uppercase; color: var(--ink-faint);
  }
  .people .name::before { display: none !important; }
}

@media (max-width: 620px) {
  .tiles { grid-template-columns: 1fr; }
  .tile { min-height: 110px; padding: 18px; }
  .tile b { font-size: 26px; }
  .auth-error { font-size: 20px; }
  .station-top .home-link { font-size: 20px; }
}

@media (max-width: 620px) {
  .session { font-size: 17px; }
  .warehouse .mock-panel { position: static; margin: 16px var(--gap) 24px; }
}

/* ---------- Роли, вход склада до конца дня (решение Марины 15.10.2026) ---------- */

.auth .remember[hidden] { display: none; }

.staff-note { margin-top: 16px; font-size: 22px; color: var(--ink-dim); }

.session .btn.switch-staff { min-height: 56px; padding: 8px 22px; font-size: 20px; border-color: var(--ink-dim); }

.owner-note { font-size: 16px; align-self: center; }

.choices-field { margin-top: 18px; border: 0; }

.choices-field legend { color: var(--ink-dim); font-size: 18px; padding: 0; margin-bottom: 6px; }

.confirm .choices-field label.choice {
  display: flex; align-items: center; gap: 12px; margin-top: 8px; font-size: 20px; color: var(--ink); cursor: pointer;
}

.confirm .choices-field label.choice input[type="radio"] {
  display: inline-block; width: 26px; height: 26px; margin: 0; padding: 0; flex: none; accent-color: var(--ink);
}

/* Переключатель кабинета на экранах склада с обычным текстом (полки, поставка, товары, принтер) */
body.warehouse-screen .station-top .switcher a { font-size: 22px; padding: 12px 22px; }

body.warehouse-screen .station-top .switcher a small { font-size: 18px; }

@media (max-width: 620px) {
  body.warehouse-screen .station-top .switcher a { font-size: 20px; padding: 10px 16px; }
  body.warehouse-screen .station-top .switcher a small { display: none; }
  .session .btn.switch-staff { width: 100%; }
  .session { width: 100%; }
}
body.warehouse-screen .product-side { font-size: 20px; }

/* Список «Что сегодня» (v4): раньше без стилей - номера торчали за карточкой, текст склеивался. */
.day-plan { list-style: none; }
.day-plan li {
  display: grid; grid-template-columns: 36px 1fr auto; column-gap: 12px; row-gap: 8px;
  align-items: baseline; padding: 14px 0; border-bottom: 1px solid var(--line);
  font-size: 20px; line-height: 1.35;
}
.day-plan li:last-child { border-bottom: 0; }
.day-plan .num { font-family: var(--display); font-weight: 700; color: var(--ink-dim); }
.day-plan .what small { display: block; font-size: 18px; color: var(--ink-dim); margin-top: 2px; }
.day-plan .when { font-size: 18px; color: var(--ink-dim); white-space: nowrap; }
.day-plan .go { grid-column: 2 / -1; }
.day-plan .go:empty { display: none; }
.day-plan li.done { color: var(--green-ink); }
.day-plan li.done s { text-decoration-thickness: 1px; }
@media (max-width: 620px) {
  .day-plan li { grid-template-columns: 32px 1fr; }
  .day-plan .when { grid-column: 2; }
}

/* Экраны склада (v4): мелкий шрифт - не меньше 18px */
body.warehouse-screen #app .eyebrow, body.warehouse #app .eyebrow { font-size: 18px; }
body.warehouse-screen #app th, body.warehouse #app th { font-size: 18px; }
body.warehouse-screen #app .tag, body.warehouse #app .tag { font-size: 18px; }
body.warehouse-screen .session, body.warehouse .session { font-size: 18px; }

/* Кончается размер и Неделя склада (v4): у этих экранов не было стилей - список с маркерами, цифры в столбик, дни слитно. */
.glist { list-style: none; }
.glist li { display: grid; grid-template-columns: minmax(0, 2.2fr) .6fr .7fr 1fr 1.2fr; gap: 6px 14px; align-items: center; padding: 12px 0; border-bottom: 1px solid var(--line); }
.glist li:last-child { border-bottom: 0; }
.glist li.head { font-family: var(--mono); font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-faint); padding-top: 0; }
.glist li.low { background: var(--amber-soft); }
.glist .pick { display: flex; align-items: center; gap: 12px; cursor: pointer; min-height: 44px; }
.card .glist .pick input:not([hidden]) { display: inline-block; width: 26px; height: 26px; margin: 0; padding: 0; flex: none; accent-color: var(--ink); }
.glist .cell[data-label]::before { content: attr(data-label) ": "; display: none; color: var(--ink-faint); }
.draft { margin-top: 18px; padding: 16px; white-space: pre-wrap; font-family: var(--mono); font-size: 16px; background: var(--surface-2); border-radius: var(--radius-card); }
@media (max-width: 620px) {
  .glist li { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); padding: 14px 8px; }
  .glist .cell, .glist .pick span { min-width: 0; overflow-wrap: anywhere; }
  .glist li.head { display: none; }
  .glist li > .cell:first-child { grid-column: 1 / -1; }
  .glist .cell[data-label]::before { display: inline; }
}
.week-people { align-items: start; display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: var(--gap); margin-top: 24px; }
.week-people .card h2 { margin-bottom: 4px; }
.week-figures { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 20px; }
.week-figures .figure-big { font-size: 38px; }
.bar { margin-top: 16px; height: 10px; background: var(--surface-2); border-radius: 5px; overflow: hidden; }
.bar i { display: block; height: 100%; background: var(--amber-ink); }
.days-strip { display: flex; gap: 8px; margin-top: 18px; flex-wrap: wrap; }
.days-strip span { flex: 1 1 0; min-width: 40px; text-align: center; font-family: var(--mono); font-size: 14px; text-transform: uppercase; color: var(--ink-dim); }
.days-strip span i { display: block; height: 28px; margin-bottom: 6px; border-radius: var(--radius); background: var(--amber-ink); }
.days-strip span.late i { background: var(--amber-ink); }
.week-people .card { margin-top: 0; }

/* Спека 027: страница «Принтер». Кнопки равные, белые; текст склада 18-20px */
.printer-page { font-size: 19px; }
.printer-page .card p, .printer-page .card li, .printer-page label { font-size: 19px; }
.printer-page .section { margin-top: 20px; }
.pr-status { list-style: none; display: grid; gap: 8px; }
.pr-status .name { display: block; font-size: 18px; color: var(--ink-dim); }
.pr-status b { font-weight: 600; }
.pr-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.pr-big { min-height: 72px; font-size: 24px; padding: 14px 32px; }
.pr-small, .pr-small + p { font-size: 18px; color: var(--ink-dim); margin-top: 18px; }
.pr-line { width: 100%; margin-top: 8px; padding: 12px; font-size: 18px; background: var(--surface-2); border: 1px solid var(--line-strong); border-radius: var(--radius-card); resize: vertical; }
.pr-other { display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-end; margin-top: 16px; }
.pr-other label { display: flex; flex-direction: column; gap: 6px; }
.pr-other input { width: 120px; min-height: 56px; font-size: 20px; padding: 6px 10px; border: 2px solid var(--line-strong); border-radius: var(--radius-card); background: var(--surface); }
.pr-test, .pr-rotate { margin-top: 20px; }
.pr-ask, .pr-hints { margin-top: 16px; }
.pr-ask[hidden], .pr-hints[hidden] { display: none; }
.pr-hints ol { margin: 8px 0 14px 24px; }
.printer-page .btn[aria-current="true"] { border: 2px solid var(--ink); font-weight: 700; }
@media (max-width: 640px) { .pr-actions .btn, .pr-big { width: 100%; } }