/* IT Workspace (design/ARKAN IT Workspace.dc.html) — new orphan landing page.
   Reuses existing .card/.card--structured/.badge/.btn primitives; only the
   page-specific layout (domain tabs, attention list, lifecycle strip,
   timeline, quick-actions row) is defined here. */

.itw-page { display: flex; flex-direction: column; gap: var(--space-6); }

/* ── Domain tabs ─────────────────────────────────────────────────────── */
.itw-domain-tabs {
  display: flex; gap: var(--space-2); overflow-x: auto;
  border-bottom: 1px solid var(--border-default);
  padding-bottom: 0;
}
.itw-domain-tab {
  padding: var(--space-3) var(--space-4);
  font-size: var(--text-sm); font-weight: var(--font-medium);
  color: var(--text-muted); text-decoration: none; white-space: nowrap;
  border-bottom: 2px solid transparent; cursor: pointer;
}
.itw-domain-tab:hover { color: var(--text-primary); }

/* ── Two-column grid ─────────────────────────────────────────────────── */
.itw-grid { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: var(--space-6); align-items: start; }
.itw-col-main { display: flex; flex-direction: column; gap: var(--space-6); min-width: 0; }
.itw-col-rail { display: flex; flex-direction: column; gap: var(--space-6); }

.itw-link { font-size: var(--text-sm); color: var(--accent-primary); text-decoration: none; white-space: nowrap; }
.itw-link:hover { text-decoration: underline; }

/* ── Требуют внимания ────────────────────────────────────────────────── */
.itw-attention-list { display: flex; flex-direction: column; gap: 2px; }
.itw-attention-row {
  display: flex; align-items: center; gap: var(--space-4);
  padding: var(--space-3) var(--space-2);
  border-radius: var(--radius-md);
  cursor: pointer;
}
.itw-attention-row:hover { background: var(--color-bg-muted); }
.itw-attention-row--zero { opacity: 0.6; }
.itw-attention-row__value {
  font-size: var(--text-xl); font-weight: var(--font-bold);
  min-width: 2.5ch; text-align: right; font-variant-numeric: tabular-nums;
}
.itw-attention-row__label { flex: 1; font-size: var(--text-sm); color: var(--text-primary); }
.itw-attention-row__arrow { color: var(--text-muted); font-size: var(--text-sm); }

/* ── Жизненный цикл активов ──────────────────────────────────────────── */
.itw-lifecycle-strip {
  display: flex; align-items: center; gap: var(--space-3); overflow-x: auto;
}
.itw-lifecycle-chip {
  display: flex; flex-direction: column; align-items: center; gap: 2px;
  min-width: 72px; padding: var(--space-2) var(--space-3);
}
.itw-lifecycle-chip__value { font-size: var(--text-lg); font-weight: var(--font-bold); color: var(--text-primary); font-variant-numeric: tabular-nums; }
.itw-lifecycle-chip__label { font-size: var(--text-xs); color: var(--text-muted); white-space: nowrap; }
.itw-lifecycle-sep { color: var(--border-default); font-size: var(--text-lg); }

/* ── Timeline (Последние события) ────────────────────────────────────── */
.itw-timeline { display: flex; flex-direction: column; }
.itw-timeline-row { display: flex; gap: var(--space-3); padding: var(--space-2) 0; position: relative; }
.itw-timeline-row:not(:last-child)::before {
  content: ''; position: absolute; left: 3px; top: 18px; bottom: -8px; width: 1px;
  background: var(--border-default);
}
.itw-timeline-dot {
  width: 7px; height: 7px; border-radius: 50%; background: var(--accent-primary);
  margin-top: 5px; flex-shrink: 0;
}
.itw-timeline-body { min-width: 0; }
.itw-timeline-text { font-size: var(--text-sm); color: var(--text-primary); }
.itw-timeline-time { font-size: var(--text-xs); color: var(--text-muted); margin-top: 2px; }

/* ── Быстрые действия ─────────────────────────────────────────────────── */
.itw-quick-actions__row { display: flex; flex-wrap: wrap; gap: var(--space-3); }

.itw-loading, .itw-error, .itw-empty { padding: var(--space-6); color: var(--text-muted); font-size: var(--text-sm); }
.itw-error { color: var(--status-danger); }

@media (max-width: 960px) {
  .itw-grid { grid-template-columns: 1fr; }
}