/* Новый вид экранов: стили группы «goods». Подключён в index.html после app.css. */

/* ---------- общие таблицы группы: строки можно выбирать; на телефоне — карточки с подписями */
.pg-t tbody tr[data-sku],.pg-t tbody tr[data-batch],.pg-t tbody tr[data-allrows]{cursor:pointer}
.pg-t tbody tr[data-sku]:focus-visible,.pg-t tbody tr[data-batch]:focus-visible,.pg-t tbody tr[data-allrows]:focus-visible{outline:2px solid #393692;outline-offset:-2px}
.pg-t td b{font-family:var(--num);font-weight:600}
.pg-t td.r{font-family:var(--num)}
.pg-t .pg-nm{font-weight:500}
.pg-t tr.pg-mut td{color:#595968}
.pg-t tr.pg-mut td b{color:inherit}
.pg-t tr.pg-mut td b.k-bad{color:#C2413A}
.pg-t tr.pg-rest td:first-child{color:#292771}
.pg-t tr.k-hl td:first-child small{color:#393692}
.kv .pg-t tr.k-hl td{background:#F3F3F5}
.pg-t td .k-chip{font-family:'Inter',system-ui,sans-serif}
.pg-wide{min-width:680px}
.pg-wide td small{white-space:nowrap}
.kv .k-scroll>.k-table{margin:0}
/* старое правило table даёт скругление, тень и overflow:hidden — у края обрезались «Т» и ₸ */
.pg .k-table{overflow:visible;border-radius:0;box-shadow:none}

/* сортировка в «Подробно» */
.pg-sort,.kv .pg-sort{display:inline-flex;align-items:center;gap:5px;min-height:32px;padding:0;border:0;background:none;box-shadow:none;
  font:inherit;font-size:12.5px;color:#595968;cursor:pointer;white-space:nowrap}
.pg-sort i{font-style:normal;font-size:10px;opacity:.45}
.pg-sort.on{color:#1D1C4C;font-weight:600}.pg-sort.on i{opacity:1}
.pg-sort:hover{color:#1C1C1E;background:none}
.pg-lnk,.kv .pg-lnk{padding:0;border:0;background:none;box-shadow:none;font:inherit;font-weight:500;color:#1C1C1E;cursor:pointer;text-align:left;
  text-decoration:underline;text-decoration-color:#CCCCD3;text-underline-offset:3px;min-height:0}
.pg-lnk:hover{color:#292771;background:none}

/* ---------- «Товары»: выбор товара и одна продажа */
.pg-pick{display:flex;align-items:center;gap:8px;font-size:13px;color:#595968}
.kv .pg-pick select{min-height:42px;max-width:260px}
.pg-unit{display:flex;flex-direction:column}
.pg-u{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,2fr) 132px;gap:16px;align-items:center;padding:11px 0;border-bottom:1px solid #F0F0F3;font-size:14.5px}
.pg-u:last-child{border-bottom:0}
.pg-u-l small{display:block;font-size:12.5px;color:#595968;margin-top:2px}
.pg-u-b{display:block;height:10px;border-radius:5px;background:#F0F0F3;overflow:hidden}
.pg-u-b i{display:block;height:100%;border-radius:5px}
.pg-u-v{text-align:right;font-family:var(--num);font-weight:500;white-space:nowrap}
.pg-u-v small{display:block;font-size:12px;color:#595968;font-weight:400;margin-top:2px}
.pg-u.pr .pg-u-l,.pg-u.pr .pg-u-v{font-weight:600}
.pg-u.tot{border-top:2px solid #E5E5EB;border-bottom:0;margin-top:2px}
.pg-u.tot .pg-u-l,.pg-u.tot .pg-u-v{font-weight:600}
.pg-u.tot.k-good .pg-u-v small,.pg-u.tot.k-bad .pg-u-v small{color:inherit;opacity:.8}

/* что если цена… */
.pg-sim{display:flex;flex-wrap:wrap;align-items:flex-end;gap:12px 16px;margin-top:16px;padding:16px;border-radius:14px;background:#F8F8FA}
.pg-sim label{display:flex;flex-direction:column;gap:6px;font-size:13px;color:#595968;font-weight:500}
.kv .pg-sim input{width:170px;min-height:44px;text-align:right;font-family:var(--num);font-size:15px;background:#fff}
.pg-sim-r{flex:1 1 240px;align-self:center;font-size:14px;line-height:1.5;color:#2E2E37}
.pg-sim-r b{font-family:var(--num)}
.pg-sim-b{display:flex;flex-wrap:wrap;gap:8px}
.pg-unit+.k-note{margin-top:10px}
.k-card>.k-more{margin-top:14px;border-color:#EBEBF0}

/* ---------- «Склад» и «Закупки»: небольшие сводки */
.pg-kv{display:flex;flex-direction:column}
.pg-kv>div{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:10px 0;border-bottom:1px solid #F0F0F3;font-size:14.5px}
.pg-kv>div:last-child{border-bottom:0}
.pg-kv span small{display:block;font-size:12.5px;color:#595968;margin-top:2px}
.pg-kv b{font-family:var(--num);font-weight:600;white-space:nowrap;text-align:right}
.pg-act{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:14px}
.kv .pg-tab{min-height:44px}
.pg-count{min-width:0}

@media (max-width:700px){
  /* таблица-карточки: название сверху, цифры с подписями в 2–3 колонки */
  .kv .k-table.pg-t,.k-table.pg-t tbody{display:block;width:100%}
  .k-table.pg-t thead{display:none}
  .k-table.pg-t tr{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px 10px;padding:12px 0;border-bottom:1px solid #F0F0F3}
  .k-table.pg-t.c2 tr{grid-template-columns:repeat(2,minmax(0,1fr))}
  .k-table.pg-t tr:last-child{border-bottom:0}
  .k-table.pg-t td,.k-table.pg-t td.r,.k-table.pg-t tr.k-sum td{padding:0;border:0;text-align:left;white-space:normal;font-size:14px;min-width:0}
  .k-table.pg-t td:first-child{grid-column:1 / -1;font-size:15px}
  .k-table.pg-t td[data-l]::before{content:attr(data-l);display:block;font-size:11.5px;color:#595968;margin-bottom:2px;font-family:'Inter',system-ui,sans-serif;font-weight:400}
  .k-table.pg-t tr.k-sum{border-top:2px solid #E5E5EB;border-bottom:0}
  .k-table.pg-t tr.k-sum td{font-weight:600}
  .kv .k-table.pg-t tr.k-hl{background:#F3F3F5;margin:0 -10px;padding:12px 10px;border-radius:12px}
  .kv .k-table.pg-t tr.k-hl td{background:none}
  .k-table.pg-t td small{white-space:normal}
  .pg-u{grid-template-columns:minmax(0,1fr) auto;gap:6px 12px}
  .pg-u-b{grid-column:1 / -1;grid-row:2}
  .pg-pick{width:100%}
  .kv .pg-pick select{flex:1;max-width:none}
  .kv .pg-sim input{width:100%}
  .pg-sim label{flex:1 1 100%}
  .pg-sim{padding:14px}
}

/* форма фрахта внутри карточки — без второй рамки */
.kv.pg .k-card>.form{border:0;padding:0;background:none;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}

/* ---------------------------------------------------------------- «Окупаемость» (js/pages/payback.js) */
.pbk .k-card{margin-bottom:14px}
.pbk .num{white-space:nowrap}
.pbk .pos,.c2-pop .pbk-bk .pos{color:#2E8A57}.pbk .neg,.c2-pop .pbk-bk .neg{color:#C2413A}
/* разбор: выручка → расходы → вернётся → вложено → итог */
.pbk-bk{display:flex;flex-direction:column}
.pbk-b{display:grid;grid-template-columns:minmax(150px,1.1fr) minmax(80px,2fr) auto 44px;gap:4px 14px;align-items:center;padding:9px 0;border-bottom:1px solid rgba(60,60,67,.07)}
.pbk-b:last-child{border-bottom:0}
.pbk-bl{display:flex;flex-direction:column;font-size:14px;font-weight:500;color:#1C1C1E;min-width:0}
.pbk-bl small{font-size:12px;font-weight:400;color:#6B6B76}
.pbk-bb{display:block;height:8px;border-radius:4px;background:rgba(118,118,128,.12);overflow:hidden}
.pbk-bb i{display:block;height:100%;border-radius:4px;background:#E79A95}
.pbk-b.rev .pbk-bb i{background:#7FA8E8}.pbk-b.ads .pbk-bb i{background:#E6B566}.pbk-b.sub .pbk-bb i{background:#9FA0F2}.pbk-b.inv .pbk-bb i{background:#B9B9C2}
.pbk-b.tot.good .pbk-bb i{background:#6CC08E}.pbk-b.tot.bad .pbk-bb i{background:#E06B63}
.pbk-bv{font-size:14.5px;font-weight:600;color:#1C1C1E;text-align:right}
.pbk-b.cost .pbk-bv,.pbk-b.ads .pbk-bv,.pbk-b.inv .pbk-bv{color:#C2413A}
.pbk-bp{font-size:12px;color:#8E8E96;text-align:right}
.pbk-b.sub{border-top:1px solid rgba(60,60,67,.18)}.pbk-b.sub .pbk-bl{font-weight:600}
.pbk-b.tot{border-top:1px solid rgba(60,60,67,.18);padding-top:11px}.pbk-b.tot .pbk-bl{font-weight:700;font-size:15px}
.pbk-b.tot .pbk-bv{font-size:17px;font-weight:700}.pbk-b.tot.good .pbk-bv{color:#2E8A57}.pbk-b.tot.bad .pbk-bv{color:#C2413A}
.pbk .pbk-x{margin:10px 0 0;font-size:12.5px;line-height:1.45;color:#6B6B76}.pbk .pbk-x .num{font-weight:600;color:#1C1C1E}
/* таблица товаров */
.pbk .pbk-tbl{display:flex;flex-direction:column}
.pbk .pbk-tr2{display:grid;grid-template-columns:minmax(0,1.6fr) repeat(4,minmax(96px,1fr)) 116px;gap:4px 16px;align-items:center;padding:11px 10px;margin:0 -10px;
  border:0;border-bottom:1px solid rgba(60,60,67,.07);background:none;font:inherit;text-align:left;color:inherit;cursor:pointer;border-radius:12px}
.pbk .pbk-tr2:not(.pbk-th):hover{background:rgba(118,118,128,.07)}
.pbk .pbk-th{cursor:default;padding-top:0;font-size:12px;color:#6B6B76}
.pbk .pbk-th span:not(:first-child),.pbk .pbk-v{text-align:right}
.pbk .pbk-th span:last-child,.pbk .pbk-w{text-align:right}
.pbk .pbk-n{display:flex;flex-direction:column;min-width:0}
.pbk .pbk-n b{font-size:14.5px;font-weight:600;color:#1C1C1E}
.pbk .pbk-n small{font-size:12px;color:#6B6B76}
.pbk .pbk-v{font-size:14px;font-weight:500;color:#1C1C1E}
.pbk .pbk-v.pos{color:#2E8A57;font-weight:600}.pbk .pbk-v.neg{color:#C2413A;font-weight:600}.pbk .pbk-tr2>span:nth-child(4){color:#5E5E68;font-weight:500}
.pbk .pbk-c{display:inline-block;padding:3px 9px;border-radius:999px;font-size:12px;font-weight:600;white-space:nowrap;background:rgba(118,118,128,.12);color:#5E5E68}
.pbk .pbk-c.good{background:rgba(52,199,89,.14);color:#1F7A44}.pbk .pbk-c.bad{background:rgba(255,59,48,.12);color:#B3261E}.pbk .pbk-c.warn{background:rgba(255,159,10,.16);color:#9A5B00}
/* проданные партии */
.pbk .pbk-past{margin:0 0 14px;padding:14px 18px;border-radius:20px;background:rgba(255,255,255,.6);border:1px solid rgba(60,60,67,.08)}
.pbk .pbk-past summary{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px;cursor:pointer;list-style:none}
.pbk .pbk-past summary::-webkit-details-marker{display:none}
.pbk .pbk-past summary b{font-size:15px;font-weight:700;color:#1C1C1E}
.pbk .pbk-past summary b::after{content:'';display:inline-block;width:7px;height:7px;margin-left:8px;border:solid #8E8E96;border-width:0 2px 2px 0;transform:translateY(-3px) rotate(45deg)}
.pbk .pbk-past[open] summary b::after{transform:translateY(0) rotate(-135deg)}
.pbk .pbk-past summary>span{font-size:13px;color:#5E5E68}.pbk .pbk-past summary .num{font-weight:600;color:#1C1C1E}.pbk .pbk-past summary .num.pos{color:#2E8A57}.pbk .pbk-past summary .num.neg{color:#C2413A}
.pbk .pbk-pt{margin-top:10px}
.pbk .pbk-pr{display:grid;grid-template-columns:minmax(0,1fr) auto auto auto;gap:2px 20px;align-items:baseline;padding:8px 0;border-bottom:1px solid rgba(60,60,67,.08);font-size:13.5px}
.pbk .pbk-pr:last-child{border-bottom:0}
.pbk .pbk-pr>span:not(:first-child){text-align:right}
.pbk .pbk-pr b{font-weight:600;color:#1C1C1E}.pbk .pbk-pr small{display:block;font-size:12px;color:#6B6B76}
.pbk .pbk-ph{font-size:12px;color:#6B6B76;padding-top:0}
.pbk .pbk-how{margin:4px 2px 0;font-size:12.5px;line-height:1.45;color:#6B6B76}
.pbk .pbk-how summary{cursor:pointer;width:max-content;font-size:13px;font-weight:600;color:#5E5CE6}
.pbk .pbk-how p{margin:6px 0 0;max-width:780px}
/* окно товара */
.c2-pop .pbk-bk{margin-bottom:6px}
.c2-pop .pbk-act{margin:10px 0 0;padding:10px 12px;border-radius:12px;background:rgba(118,118,128,.08);font-size:13.5px;line-height:1.45;color:#1C1C1E}
.c2-pop .pbk-act .num{white-space:nowrap;font-weight:600}
.c2-pop .pbk-pn{margin:8px 0 4px;font-size:12.5px;line-height:1.45;color:#6B6B76}.c2-pop .pbk-pn .num{white-space:nowrap;font-weight:600;color:#1C1C1E}
@media (max-width:760px){
  .pbk-b{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"l v" "b b";gap:5px 10px}
  .pbk-bl{grid-area:l}.pbk-bv{grid-area:v}.pbk-bb{grid-area:b;height:6px}.pbk-bp{display:none}
  .pbk .pbk-th{display:none}
  .pbk .pbk-tr2{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"n w" "i r";gap:4px 10px;padding:12px 8px;margin:0 -8px}
  .pbk .pbk-tr2>span:nth-child(3),.pbk .pbk-tr2>span:nth-child(4){display:none}
  .pbk .pbk-n{grid-area:n}.pbk .pbk-w{grid-area:w}
  .pbk .pbk-tr2>span:nth-child(2){grid-area:i;text-align:left;font-size:13px;color:#5E5E68}
  .pbk .pbk-tr2>span:nth-child(2)::before{content:'вложено ';font-weight:400}
  .pbk .pbk-tr2>span:nth-child(5){grid-area:r;font-weight:600}
  .pbk .pbk-pr{grid-template-columns:minmax(0,1fr) auto}
  .pbk .pbk-pr>span:nth-child(2),.pbk .pbk-pr>span:nth-child(3){display:none}
  .pbk .pbk-ph{display:none}
}

/* «Проданные партии»: колонки общие для всех строк (раньше у каждой строки своя ширина), строка «Итого» */
@media (min-width:761px){
  @supports (grid-template-columns:subgrid){
    .pbk .pbk-pt{display:grid;grid-template-columns:minmax(0,1fr) auto auto auto;column-gap:28px}
    .pbk .pbk-pr{grid-column:1/-1;grid-template-columns:subgrid;column-gap:28px}
  }
}
.pbk .pbk-pr.pbk-ptot{border-top:1.5px solid rgba(60,60,67,.2);border-bottom:0;margin-top:-1px;padding-top:10px}
.pbk .pbk-pr.pbk-ptot b{font-weight:700}
.pbk .pbk-pr.pbk-ptot .num{font-weight:700;color:#1C1C1E}
.pbk .pbk-pr.pbk-ptot .num.pos{color:#2E8A57}.pbk .pbk-pr.pbk-ptot .num.neg{color:#C2413A}