/* ==========================================================================
   DMGroup — «Кабинет» partner cabinet
   1:1 from the Figma frames (figma-dmgroup/tree.mjs <node> --props):
     обзор       50:32  body [50:49]
     занятость   50:155 body [50:172]
     спека       51:2   body [51:19]
     у менеджера 52:2   body [52:19]
     скидки      53:2   body [53:19]
     согласована 75:2   body [75:19]
   Body shells: pad 48/48/48/48, gap 32, content 1344 = .inner.
   ========================================================================== */

/* ==========================================================================
   Cabinet sub-bar [50:33]  (1440x67: row 66 pad 16,48 + 1px rule #463f38)
   ========================================================================== */

.cab-subbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  min-height: 66px;
  padding: 16px var(--gutter);
}
.cab-subbar__brand { display: inline-flex; align-items: center; gap: 8px; }
.cab-subbar__mark { flex: 0 0 auto; width: 10px; height: 10px; background: var(--c-accent); }
.cab-subbar__name { font-size: 14px; line-height: 18px; font-weight: 500; color: var(--c-text-alt); }
.cab-subbar__city { font-size: 14px; line-height: 20px; color: var(--c-label); }

.cab-subbar__nav { display: flex; align-items: center; gap: 8px; }
.cab-subbar__nav a {
  display: inline-flex;
  align-items: center;
  padding: 8px 12px;
  border-radius: var(--r);
  font-size: 14px;
  line-height: 18px;
  font-weight: 500;
  color: var(--c-text-alt);
}
.cab-subbar__nav a:hover { background: var(--c-well); }
.cab-subbar__nav a.cab-is-active { color: var(--c-accent); }

.cab-subbar__rule { height: 1px; background: var(--c-rule-2); }

/* ==========================================================================
   Shell: body [50:49] — section pad 48, gap 32; page bg #0e0d0b
   ========================================================================== */

.page-cabinet { background: var(--c-bg-deep); }
.cab-body {
  background: var(--c-bg-deep);
  padding: 48px var(--gutter);
}
.cab-body__inner { display: flex; flex-direction: column; gap: 32px; }

/* ==========================================================================
   Shared atoms
   ========================================================================== */

/* 11/14 w500 ls1.2 — inline micro label (sans, not .label which is mono) */
.cab-mlab {
  font-size: 11px;
  line-height: 14px;
  font-weight: 500;
  letter-spacing: 1.2px;
  color: var(--c-label);
}
.cab-mlab--accent { color: var(--c-accent); }
.cab-mlab--muted { color: var(--c-muted); }

.cab-rule { height: 1px; background: var(--c-rule-2); }

.cab-h2 { font-size: 20px; line-height: 26px; font-weight: 600; letter-spacing: -0.2px; color: var(--c-text-alt); }

/* status pill [51:23] pad 8,12 r2 fill #3c2820 text #e8956a 14/18 w500 */
.cab-status {
  display: inline-flex;
  align-items: center;
  padding: 8px 12px;
  border-radius: var(--r);
  background: var(--c-accent-dim);
  font-size: 14px;
  line-height: 18px;
  font-weight: 500;
  color: var(--c-accent);
  white-space: nowrap;
}

/* ==========================================================================
   Title block [50:50] 1344x124 gap 12
   ========================================================================== */

.cab-title { display: flex; flex-direction: column; gap: 12px; }
.cab-title__row { display: flex; align-items: center; gap: 16px; }
.cab-title__h1 { font-size: 32px; line-height: 40px; font-weight: 600; letter-spacing: -0.4px; color: var(--c-text-alt); }
.cab-title__lead { font-size: 16px; line-height: 24px; color: var(--c-label); }

/* subnav [50:53] item pad 8,12,0,12 gap 8 + 2px mark */
.cab-subnav { display: flex; gap: 8px; }
.cab-subnav__item {
  display: inline-flex;
  flex-direction: column;
  gap: 8px;
  padding: 8px 12px 0;
  font-size: 14px;
  line-height: 18px;
  font-weight: 500;
  color: var(--c-label);
}
.cab-subnav__item:hover { color: var(--c-text-alt); }
.cab-subnav__item--on { color: var(--c-accent); }
.cab-subnav__mark { width: 28px; height: 2px; background: transparent; }
.cab-subnav__item--on .cab-subnav__mark { background: var(--c-accent); }

.cab-note {
  font-size: 14px;
  line-height: 20px;
  letter-spacing: 1.2px;
  color: var(--c-label);
}

/* ==========================================================================
   Overview [50:49]
   ========================================================================== */

.cab-block { display: flex; flex-direction: column; gap: 8px; }

/* conditions [50:67] rows 78 = pad 16/0, gap 16, num 88 wide */
.cab-cond { display: flex; flex-direction: column; }
.cab-cond__line {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 16px 0;
}
.cab-cond__num { flex: 0 0 88px; font-size: 18px; line-height: 22px; font-weight: 600; color: var(--c-accent); }
.cab-cond__copy { display: flex; flex-direction: column; gap: 2px; flex: 1 1 auto; min-width: 0; }

/* generic label-over-value list row (holds, specs, discounts) */
.cab-row {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 16px 0;
  color: inherit;
}
.cab-row__copy { display: flex; flex-direction: column; gap: 2px; flex: 1 1 auto; min-width: 0; }
.cab-row__title { font-size: 16px; line-height: 24px; color: var(--c-text-alt); }
.cab-row__sub { font-size: 14px; line-height: 20px; color: var(--c-label); }
.cab-row__aside { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; flex: 0 0 auto; }
.cab-row__meta { font-size: 14px; line-height: 20px; color: var(--c-label); }
.cab-row__meta--accent { color: var(--c-accent); }
.cab-row__value { font-size: 18px; line-height: 22px; font-weight: 600; color: var(--c-text-alt); }

.cab-block__head { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.cab-block__link { font-size: 14px; line-height: 18px; font-weight: 500; color: var(--c-accent); }
.cab-block__link:hover { text-decoration: underline; text-underline-offset: 3px; }
.cab-block__note { font-size: 14px; line-height: 20px; color: var(--c-label); }
.cab-block__spacer { height: 8px; }

.cab-actions { display: flex; align-items: center; gap: 16px; }
.cab-btn { min-height: 46px; }
.cab-textlink { font-size: 14px; line-height: 18px; font-weight: 500; color: var(--c-accent); white-space: nowrap; }
.cab-textlink:hover { text-decoration: underline; text-underline-offset: 3px; }

/* ==========================================================================
   Occupancy [50:189] filters, [50:204] grid, [50:362] legend
   ========================================================================== */

.cab-filters { display: flex; align-items: flex-start; gap: 24px; }
.cab-filters__dates { flex: 0 0 320px; display: flex; flex-direction: column; gap: 8px; }
.cab-filters__cats { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 8px; }
.cab-filters__tabs { display: flex; align-items: center; gap: 16px; min-height: 44px; }
.cab-tab { font-size: 14px; line-height: 18px; font-weight: 500; color: var(--c-label); }
.cab-tab:hover { color: var(--c-text-alt); }
.cab-tab--on { color: var(--c-accent); }

/* input box [50:192] 320x44 fill #1a1816 stroke #463f38 r2 */
.cab-input {
  display: flex;
  align-items: center;
  min-height: 44px;
  width: 100%;
  padding: 0 12px;
  background: var(--c-surface);
  border: 1px solid var(--c-rule-2);
  border-radius: var(--r);
  font-size: 14px;
  line-height: 20px;
  color: var(--c-text-alt);
}

/* grid [50:204] 1344: 616 + 7 x 96, gap 8; row 64 pad 12/0; cell 96x40 */
.cab-grid { display: flex; flex-direction: column; }
.cab-grid__head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) repeat(7, 96px);
  gap: 8px;
  align-items: center;
  padding-bottom: 8px;
}
.cab-grid__day { text-align: center; }
.cab-grid__day--soon { color: var(--c-accent); }
.cab-grid__row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) repeat(7, 96px);
  gap: 8px;
  align-items: center;
  padding: 12px 0;
  border-bottom: 1px solid var(--c-rule-2);
}
.cab-grid__copy { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.cab-grid__name { font-size: 14px; line-height: 20px; color: var(--c-text-alt); }

/* cell states: hold (accent), free (outline), part (tint), full (well) */
.cab-cell {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  padding: 0 4px;
  border-radius: var(--r);
  border: 1px solid transparent;
  font-size: 14px;
  line-height: 18px;
  font-weight: 500;
  color: var(--c-text-alt);
}
.cab-cell--hold { background: var(--c-accent); color: var(--c-bg); }
.cab-cell--free { border-color: var(--c-rule-2); }
.cab-cell--part { background: var(--c-accent-dim); }
.cab-cell--full { background: var(--c-surface); color: var(--c-label); }

.cab-legend { display: flex; gap: 24px; flex-wrap: wrap; }
.cab-legend__item { display: flex; align-items: center; gap: 8px; }
.cab-legend__item .cab-cell { width: 96px; flex: 0 0 96px; }
.cab-legend__label { font-size: 14px; line-height: 20px; color: var(--c-label); }

/* ==========================================================================
   Spec [51:19] / Manager [52:19] / Approved [75:19] two-column shells
   ========================================================================== */

.cab-cols { display: flex; gap: 48px; align-items: flex-start; }
.cab-col { display: flex; flex-direction: column; gap: 16px; }
.cab-col--left { flex: 0 0 560px; width: 560px; }
.cab-col--right { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 8px; }
.cab-col--thread { gap: 24px; }

/* form field [51:42] label 14 + 8 gap + box 44 (input) */
.cab-field { display: flex; flex-direction: column; gap: 8px; }
.cab-field__box {
  display: flex;
  align-items: flex-start;
  min-height: 44px;
  width: 100%;
  padding: 11px 12px;
  background: var(--c-surface);
  border: 1px solid var(--c-rule-2);
  border-radius: var(--r);
  font-size: 14px;
  line-height: 20px;
  color: var(--c-text-alt);
}
.cab-field__box--area { min-height: 88px; }
.cab-field__box--empty { color: var(--c-label); }

/* read-only fact [52:43] label 14 + 8 gap + 16/24 value */
.cab-fact { display: flex; flex-direction: column; gap: 8px; }
.cab-fact__value { font-size: 16px; line-height: 24px; color: var(--c-text-alt); }

/* line item [51:64] 12 gap, pad 16/0; copy 2 gap */
.cab-line {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px 0;
}
.cab-line__copy { display: flex; flex-direction: column; gap: 2px; flex: 1 1 auto; min-width: 0; }
.cab-line__name { font-size: 14px; line-height: 20px; color: var(--c-text-alt); }
.cab-line__calc { font-size: 11px; line-height: 14px; font-weight: 500; letter-spacing: 1.2px; color: var(--c-accent); }
.cab-line__stock { font-size: 11px; line-height: 14px; font-weight: 500; letter-spacing: 1.2px; color: var(--c-label); }
.cab-line__qty { flex: 0 0 56px; display: flex; flex-direction: column; align-items: center; gap: 2px; }
.cab-line__qtybox {
  width: 56px;
  min-height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--c-surface);
  border: 1px solid var(--c-rule-2);
  border-radius: var(--r);
  font-size: 14px;
  line-height: 18px;
  font-weight: 500;
  color: var(--c-text-alt);
}
.cab-line__sum { flex: 0 0 96px; text-align: right; }
.cab-line__price { font-size: 18px; line-height: 22px; font-weight: 600; color: var(--c-text-alt); white-space: nowrap; }
.cab-line__mul { flex: 0 0 auto; font-size: 14px; line-height: 18px; font-weight: 500; color: var(--c-label); }

.cab-line--rule { border-bottom: 1px solid var(--c-rule-2); }

/* warning row [51:91] pad-top 8, warn plate 92 fill #3c2820 pad 12 */
.cab-warn { padding-top: 8px; }
.cab-warn__plate {
  background: var(--c-accent-dim);
  border-radius: var(--r);
  padding: 12px;
  display: flex;
  align-items: center;
  gap: 12px;
}

/* summary plate [51:119] 736x225 fill #1a1816 stroke #463f38 pad 16 gap 8 */
.cab-summary {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 16px;
  background: var(--c-surface);
  border: 1px solid var(--c-rule-2);
  border-radius: var(--r);
}
.cab-summary__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  font-size: 14px;
  line-height: 20px;
  color: var(--c-label);
}
.cab-summary__row span:last-child { color: var(--c-text-alt); white-space: nowrap; }
.cab-summary__total {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  font-size: 16px;
  line-height: 24px;
  color: var(--c-text-alt);
}
.cab-summary__sum {
  font-size: 28px;
  line-height: 34px;
  font-weight: 600;
  letter-spacing: -0.3px;
  color: var(--c-text-alt);
  white-space: nowrap;
}
.cab-summary__note { font-size: 11px; line-height: 14px; font-weight: 500; letter-spacing: 1.2px; color: var(--c-accent); }
.cab-summary__note--muted { color: var(--c-label); }

/* ==========================================================================
   Manager [52:19] thread
   ========================================================================== */

.cab-log { display: flex; flex-direction: column; }
.cab-log__step { display: flex; gap: 16px; padding: 16px 0 12px; }
.cab-log__step--alt { padding: 12px 0 16px; }
.cab-log__date { flex: 0 0 38px; font-size: 11px; line-height: 14px; font-weight: 500; letter-spacing: 1.2px; color: var(--c-label); }
.cab-log__date--on { color: var(--c-accent); }
.cab-log__text { flex: 1 1 auto; min-width: 0; font-size: 14px; line-height: 20px; color: var(--c-text-alt); }

/* question plate [52:64] fill #1a1816 stroke #e8956a pad 16 gap 8 */
.cab-quote {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 16px;
  background: var(--c-surface);
  border: 1px solid var(--c-accent);
  border-radius: var(--r);
}
.cab-quote__text { font-size: 16px; line-height: 24px; color: var(--c-text-alt); }

/* ==========================================================================
   Discounts [53:19]
   ========================================================================== */

.cab-partner { display: flex; gap: 48px; align-items: flex-start; }
.cab-partner__rate { flex: 0 0 280px; display: flex; flex-direction: column; gap: 8px; }
.cab-partner__num {
  font-size: 28px;
  line-height: 34px;
  font-weight: 600;
  letter-spacing: -0.3px;
  color: var(--c-accent);
}
.cab-partner__cap { font-size: 16px; line-height: 24px; color: var(--c-text-alt); }
.cab-partner__rules {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding-top: 24px;
}
.cab-partner__rules p { font-size: 14px; line-height: 20px; color: var(--c-label); }

/* personal table [53:49] head pad-top 8; row 1344x68 gap 16 pad 16/0 */
.cab-table { display: flex; flex-direction: column; }
.cab-table__head { display: flex; gap: 16px; padding: 8px 0 0; }
.cab-table__row { display: flex; gap: 16px; align-items: center; padding: 16px 0; }
.cab-table__rule { height: 1px; background: var(--c-rule-2); }
.cab-th--model { flex: 0 0 420px; min-width: 0; }
.cab-th--off { flex: 0 0 80px; }
.cab-th--chain { flex: 1 1 auto; min-width: 0; }
.cab-table__model { display: flex; flex-direction: column; gap: 2px; flex: 0 0 420px; min-width: 0; }
.cab-table__name { font-size: 14px; line-height: 20px; color: var(--c-text-alt); }
.cab-table__off { flex: 0 0 80px; font-size: 18px; line-height: 22px; font-weight: 600; color: var(--c-accent); }
.cab-table__chain { flex: 1 1 auto; min-width: 0; font-size: 14px; line-height: 20px; color: var(--c-text-alt); white-space: nowrap; }

/* numbered order list [53:82] 1344x78 gap 16 pad 16/0, n 32 wide */
.cab-order { display: flex; flex-direction: column; }
.cab-order__line { display: flex; align-items: center; gap: 16px; padding: 16px 0; }
.cab-order__n { flex: 0 0 32px; font-size: 18px; line-height: 22px; font-weight: 600; color: var(--c-accent); }
.cab-order__copy { display: flex; flex-direction: column; gap: 2px; flex: 1 1 auto; min-width: 0; }
.cab-order__title { font-size: 16px; line-height: 24px; color: var(--c-text-alt); }
.cab-order__text { font-size: 14px; line-height: 20px; color: var(--c-label); }

/* worked example [53:114] 1344x198 pad 16 gap 8 (+ 4 between the last lines) */
.cab-example {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 16px;
  background: var(--c-surface);
  border: 1px solid var(--c-rule-2);
  border-radius: var(--r);
}
.cab-example__title { font-size: 20px; line-height: 26px; font-weight: 600; letter-spacing: -0.2px; color: var(--c-text-alt); }
.cab-example p { font-size: 14px; line-height: 20px; color: var(--c-text-alt); }
.cab-example p + p { margin-top: 4px; }
.cab-example__lead { font-size: 16px; line-height: 24px !important; }

/* ==========================================================================
   Approved [75:19]
   ========================================================================== */

.cab-call {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 16px;
  background: var(--c-surface);
  border: 1px solid var(--c-rule-2);
  border-radius: var(--r);
}
.cab-call__text { font-size: 16px; line-height: 24px; color: var(--c-text-alt); }
.cab-call__by { font-size: 14px; line-height: 20px; color: var(--c-label); }

.cab-doc { display: flex; flex-direction: column; }
.cab-doc__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 16px 0;
}
.cab-doc__copy { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.cab-doc__title { font-size: 16px; line-height: 24px; color: var(--c-text-alt); }
.cab-doc__sub { font-size: 14px; line-height: 20px; color: var(--c-label); }

/* ==========================================================================
   Responsive — the cabinet is a 1440 design; below 900 it must not break
   ========================================================================== */

@media (max-width: 1100px) {
  .cab-cols { flex-direction: column; gap: 32px; }
  .cab-col--left { flex: 0 0 auto; width: 100%; }
  .cab-partner { flex-direction: column; gap: 16px; }
  .cab-partner__rate { flex: 0 0 auto; width: 100%; }
  .cab-partner__rules { padding-top: 0; }
  .cab-grid__head, .cab-grid__row { min-width: 1200px; }
  .cab-grid { overflow-x: auto; }
}

@media (max-width: 900px) {
  .cab-body { padding: 24px var(--gutter) 32px; }
  .cab-body__inner { gap: 24px; }
  .cab-subbar { flex-direction: column; align-items: flex-start; gap: 8px; padding: 12px var(--gutter); }
  .cab-subbar__nav { flex-wrap: wrap; margin-left: -12px; }
  .cab-title__h1 { font-size: 28px; line-height: 34px; letter-spacing: -0.3px; }
  .cab-subnav { flex-wrap: wrap; }

  .cab-filters { flex-direction: column; gap: 16px; }
  .cab-filters__dates { flex: 0 0 auto; width: 100%; }
  .cab-filters__tabs { flex-wrap: wrap; gap: 12px; }

  .cab-cond__line, .cab-row, .cab-line, .cab-order__line { gap: 12px; }
  .cab-table { overflow-x: auto; }
  .cab-table__head, .cab-table__row { min-width: 860px; }
  .cab-legend { gap: 12px; }
  .cab-legend__item .cab-cell { width: 72px; flex: 0 0 72px; }
  .cab-actions { flex-wrap: wrap; gap: 12px; }
  .cab-summary__sum { font-size: 24px; line-height: 30px; }
}

@media (max-width: 620px) {
  .cab-line__qty { flex: 0 0 48px; }
  .cab-line__qtybox { width: 48px; }
  .cab-line__sum { flex: 0 0 72px; }
  .cab-line__price { font-size: 16px; line-height: 22px; }
  .cab-legend__item .cab-cell { width: 56px; flex: 0 0 56px; }
}