/* KOJAK rep app · «المخزون» and the stock-take (الجرد). Colours come from shared/tokens.css only. */
.item__icon--ok { background: var(--kj-success-soft); color: var(--kj-success-deep); }

/* ── stock page ── */
.stock-hero__total { display: flex; align-items: baseline; gap: 6px; margin: var(--kj-sp-2) 0 var(--kj-sp-3); font-variant-numeric: tabular-nums; }
.stock-hero__total b { font-size: var(--kj-fs-4xl); line-height: 1.1; font-weight: var(--kj-fw-medium); color: var(--kj-dark); }
.stock-hero__total small { font-size: var(--kj-fs-base); color: var(--kj-gray-500); }
/* the two tiles: products (cards + goods without a barcode) and scrap */
.stock-tiles { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--kj-sp-2); }
.stock-tile { display: flex; flex-direction: column; gap: 2px; padding: 10px 12px; background: var(--kj-white); border: 1px solid var(--kj-gray-200); border-radius: var(--kj-radius-lg); min-width: 0; }
.stock-tile__label { display: inline-flex; align-items: center; gap: 4px; font-size: var(--kj-fs-sm); color: var(--kj-gray-600); }
.stock-tile__label .kj-icon { color: var(--kj-gold-deep); }
.stock-tile b { font-size: var(--kj-fs-lg); font-weight: var(--kj-fw-medium); font-variant-numeric: tabular-nums; white-space: nowrap; }
.stock-tile small { font-size: var(--kj-fs-xs); color: var(--kj-gray-500); }
/* his gold with customers and suppliers (لك / عليك) */
.stock-pos { margin-top: var(--kj-sp-3); padding-top: var(--kj-sp-2); border-top: 1px solid var(--kj-gold-soft); }
.stock-pos__row { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 2px var(--kj-sp-3); padding: 5px 0; font-size: var(--kj-fs-md); }
.stock-pos__row > span:first-child { display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; color: var(--kj-gray-600); }
.stock-pos__row .amt { font-weight: var(--kj-fw-medium); }
.stock-pos__vals { display: inline-flex; align-items: center; gap: var(--kj-sp-3); margin-inline-start: auto; }
.stock-take-btn { margin-top: var(--kj-sp-3); }
.stock-last { display: flex; align-items: center; gap: 4px; margin-top: var(--kj-sp-2); font-size: var(--kj-fs-sm); }
.stock-last.is-ok { color: var(--kj-success-deep); }
.stock-last.is-off { color: var(--kj-warning-deep); }
.stock-note { display: flex; align-items: center; gap: 4px; font-size: var(--kj-fs-sm); margin: 0 4px var(--kj-sp-3); }

/* tabs under the card: المنتجات · الحركات · المجموعات · الجرد */
.stock-tabs { margin: var(--kj-sp-5) 0 var(--kj-sp-3); }
.stock-empty { padding: var(--kj-sp-4); font-size: var(--kj-fs-base); }

.stock-groups { padding: 0; overflow: hidden; }
.stock-group__wrap + .stock-group__wrap { border-top: 0.5px solid var(--kj-gray-100); }
.stock-group { width: 100%; display: flex; align-items: center; gap: var(--kj-sp-2); padding: 12px 14px; border: 0; background: none; color: inherit; font: inherit; text-align: start; cursor: pointer; }
.stock-group__name { flex: 1; min-width: 0; font-weight: var(--kj-fw-medium); }
.stock-group > span { font-size: var(--kj-fs-sm); font-variant-numeric: tabular-nums; white-space: nowrap; }
.stock-group .kj-icon { color: var(--kj-gray-400); transition: transform var(--kj-transition-fast); }
.stock-group[aria-expanded="true"] .kj-icon { transform: rotate(180deg); }
.stock-cards { padding: 0 14px 8px; }
.stock-card { display: grid; grid-template-columns: 1fr auto; gap: 2px 8px; padding: 8px 0; border-top: 0.5px solid var(--kj-gray-100); font-size: var(--kj-fs-sm); }
.stock-card__code { font-variant-numeric: tabular-nums; color: var(--kj-gray-700); }
.stock-card__w { white-space: nowrap; font-variant-numeric: tabular-nums; text-align: end; }
.stock-card__w small { color: var(--kj-gray-500); }
.stock-card__meta { grid-column: 1 / -1; font-size: var(--kj-fs-xs); }

.stock-day + .stock-day { margin-top: var(--kj-sp-4); }
.stock-day__head { margin: 0 4px 6px; font-size: var(--kj-fs-sm); font-weight: var(--kj-fw-medium); color: var(--kj-gray-600); }
.stock-more { margin-top: var(--kj-sp-2); }
.stock-moves { padding: 0; }
.stock-move { display: flex; align-items: center; gap: 10px; width: 100%; padding: 10px 14px; border: 0; background: none; font: inherit; text-align: start; color: inherit; }
button.stock-move { cursor: pointer; }
.stock-move + .stock-move { border-top: 0.5px solid var(--kj-gray-100); }
.stock-move__out { background: var(--kj-gray-100); color: var(--kj-gray-600); }
.stock-move__adj { background: var(--kj-gold-cream); color: var(--kj-gold-deep); }
.stock-move__body { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.stock-move__body b { font-weight: var(--kj-fw-medium); font-size: var(--kj-fs-base); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.stock-move__body small { font-size: var(--kj-fs-xs); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.stock-move__in { color: var(--kj-success-deep); }
.stock-move__qty { display: flex; flex-direction: column; align-items: flex-end; font-variant-numeric: tabular-nums; white-space: nowrap; }
.stock-move__qty small { font-size: var(--kj-fs-xs); color: var(--kj-gray-500); }
.stock-move__qty b { font-weight: var(--kj-fw-medium); font-size: var(--kj-fs-base); }

/* ── stock-take sheet ── */
.take__counts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--kj-sp-2); margin-top: var(--kj-sp-2); }
.take__count { display: flex; flex-direction: column; align-items: center; padding: 6px 8px; border-radius: var(--kj-radius-lg); border: 0.5px solid; }
.take__count span { font-size: var(--kj-fs-sm); }
.take__count b { font-size: var(--kj-fs-2xl); line-height: 1.2; font-weight: var(--kj-fw-medium); font-variant-numeric: tabular-nums; }
.take__count--ok { background: var(--kj-success-soft); border-color: var(--kj-success); color: var(--kj-success-deep); }
.take__count--left { background: var(--kj-gold-cream); border-color: var(--kj-gold-soft); color: var(--kj-gold-deep); }

.take-hint { font-size: var(--kj-fs-sm); }
.take-weight { display: flex; align-items: center; justify-content: space-between; gap: var(--kj-sp-3); padding: 8px 0; border-bottom: 0.5px solid var(--kj-gray-100); }
.take-weight__label { display: flex; flex-direction: column; }
.take-weight__label small { font-size: var(--kj-fs-xs); }
.take-weight .input-group { flex: 0 1 160px; }
.take-add { margin-top: var(--kj-sp-4); display: flex; flex-direction: column; gap: 6px; }
.take-add__row { display: flex; gap: var(--kj-sp-2); }
.take-add__row .input { flex: 1; min-width: 0; }

.take-sum { margin-top: var(--kj-sp-3); font-size: var(--kj-fs-md); font-variant-numeric: tabular-nums; }
.take-lines { padding: 0; }
.take-line { display: grid; grid-template-columns: auto 1fr auto; gap: 8px; align-items: center; padding: 8px 12px; font-size: var(--kj-fs-sm); font-variant-numeric: tabular-nums; }
.take-line + .take-line { border-top: 0.5px solid var(--kj-gray-100); }
.take-line > span:nth-child(2) { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.take-line b { font-weight: var(--kj-fw-medium); white-space: nowrap; }
.take-line--off b { color: var(--kj-danger-deep); }

/* ── المنتجات: kinds of what he holds ── */
.stock-sec + .stock-sec { margin-top: var(--kj-sp-4); }
.stock-sec__head { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin: 0 4px 6px; }
.stock-sec__head b { font-weight: var(--kj-fw-medium); color: var(--kj-gray-700); }
.stock-list { padding: 0 14px; }
.stock-line { display: flex; align-items: center; justify-content: space-between; gap: var(--kj-sp-3); padding: 10px 0; font-size: var(--kj-fs-md); }
.stock-line + .stock-line { border-top: 1px solid var(--kj-gray-100); }
.stock-line b { font-weight: var(--kj-fw-medium); font-variant-numeric: tabular-nums; white-space: nowrap; }

/* ── الجرد: previous stock-takes ── */
.stock-takes { padding: 0; }
.stock-take-row { display: flex; align-items: center; gap: 10px; width: 100%; padding: 10px 14px; border: 0; background: none; font: inherit; text-align: start; color: inherit; cursor: pointer; }
.stock-take-row + .stock-take-row { border-top: 1px solid var(--kj-gray-100); }
.stock-take-row > .kj-icon:last-child { color: var(--kj-gray-400); flex: none; }
.stock-take-row__off { background: var(--kj-warning-soft); color: var(--kj-warning-deep); }
.take-settle { margin-top: var(--kj-sp-4); }
.take-settle p { margin: 6px 0 0; font-size: var(--kj-fs-sm); text-align: center; }

/* ── المنتجات by the rep's groups: folded; open = received · sold · left, and where it came in from ── */
.pgs { display: flex; flex-direction: column; gap: var(--kj-sp-2); }
.pg { padding: 0; overflow: hidden; }
.pg__head { display: flex; align-items: center; gap: 10px; width: 100%; padding: 12px 14px; border: 0; background: none; font: inherit; color: inherit; text-align: start; cursor: pointer; }
.pg__head > .kj-icon:last-child { color: var(--kj-gray-400); flex: none; transition: transform var(--kj-transition-fast); }
.pg__head[aria-expanded="true"] > .kj-icon:last-child { transform: rotate(180deg); }
.pg__icon { width: 32px; height: 32px; flex: 0 0 32px; border-radius: var(--kj-radius-md); background: var(--kj-gold-cream); color: var(--kj-gold-deep); display: grid; place-items: center; }
.pg__icon.is-muted { background: var(--kj-gray-100); color: var(--kj-gray-500); }
.pg__name { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.pg__name b { font-weight: var(--kj-fw-medium); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pg__name small { font-size: var(--kj-fs-xs); color: var(--kj-gray-500); }
.pg__w { font-weight: var(--kj-fw-medium); font-variant-numeric: tabular-nums; white-space: nowrap; }
.pg__body { padding: 0 14px 12px; border-top: 1px solid var(--kj-gray-100); }
.pg__body > .card { border: 0; box-shadow: none; }
.pg__figs { display: grid; grid-template-columns: repeat(auto-fit, minmax(0, 1fr)); gap: 6px; margin-top: 10px; }
.pg__fig { display: flex; flex-direction: column; align-items: center; padding: 8px 4px; border-radius: var(--kj-radius-md); background: var(--kj-bg); }
.pg__fig small { font-size: var(--kj-fs-xs); color: var(--kj-gray-500); }
.pg__fig b { font-weight: var(--kj-fw-medium); font-variant-numeric: tabular-nums; white-space: nowrap; }
.pg__fig.is-left { background: var(--kj-gold-cream); }
.pg__rcpts { margin-top: 10px; }
.pg__rcpts-head { font-size: var(--kj-fs-sm); font-weight: var(--kj-fw-medium); color: var(--kj-gray-600); margin-bottom: 2px; }
.pg__rcpt { display: flex; align-items: center; gap: 10px; padding: 8px 0; color: inherit; text-decoration: none; }
.pg__rcpt + .pg__rcpt { border-top: 1px solid var(--kj-gray-100); }
.pg__rcpt-who { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.pg__rcpt-who b { font-weight: var(--kj-fw-medium); font-size: var(--kj-fs-base); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pg__rcpt-who small, .pg__rcpt-w small { font-size: var(--kj-fs-xs); color: var(--kj-gray-500); }
.pg__rcpt-w { display: flex; flex-direction: column; align-items: flex-end; font-variant-numeric: tabular-nums; white-space: nowrap; }
.pg__rcpt-w b { font-weight: var(--kj-fw-medium); }
.pg__none { margin: 10px 0 0; font-size: var(--kj-fs-sm); color: var(--kj-gray-500); }
.pg__none.is-off { color: var(--kj-warning-deep); }

/* ── a parked stock-take, on the stock page ── */
.stock-parked { display: flex; align-items: center; gap: var(--kj-sp-2); margin-top: var(--kj-sp-3); padding: 12px 14px; border-color: var(--kj-gold); background: var(--kj-gold-cream); }
.stock-parked > .kj-icon { color: var(--kj-gold-deep); flex: none; }
.stock-parked__txt { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.stock-parked__txt small { font-size: var(--kj-fs-xs); color: var(--kj-gray-600); }

/* ── the stock-take page (the transaction form's sections and rows, from txn.css) ── */
.take__intro { margin: 0 4px var(--kj-sp-2); font-size: var(--kj-fs-sm); }
.take .sec__head { cursor: default; }
.take__odd { display: flex; align-items: flex-start; gap: 4px; font-size: var(--kj-fs-xs); line-height: 1.6; color: var(--kj-warning-deep); }
.take__odd .kj-icon { flex: none; margin-top: 2px; }
.tag--off { background: var(--kj-warning-soft); color: var(--kj-warning-deep); }
.take__karat { margin-top: 2px; }
.take__none { margin: 0; font-size: var(--kj-fs-sm); }
.take__choice { margin-top: var(--kj-sp-4); padding: 12px 14px; background: var(--kj-white); border: 1px solid var(--kj-gray-200); border-radius: var(--kj-radius-lg); font-size: var(--kj-fs-sm); line-height: 1.7; }
.take__choice p { margin: 0; }
.take__choice p + p { margin-top: 6px; }
.take .tag { gap: 4px; }
/* the summary with a difference: «اعتمد أرقام الجرد» across, then رجوع · أكمل على المسجّل */
.txn-bar__btns.take-bar--choice { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.take-bar--choice .take-bar__wide { grid-column: 1 / -1; }
/* four tabs on a phone: each as wide as its word, «إدارة المجموعات» on one line */
.stock-tabs button { flex: 1 1 auto; padding-inline: 8px; white-space: nowrap; font-size: var(--kj-fs-base); }