/* ── Object card — ARKAN UI core (specs/MODULES_CATALOG.md) ──
   Body content for the 380px object card: head → context → route → domain
   blocks → related objects. Meant to sit inside components/panel.js's
   .core-panel__body — no width/positioning of its own. */

.obj-card { display: flex; flex-direction: column; gap: 18px; }

.obj-card__head { display: flex; flex-direction: column; gap: 6px; }
.obj-card__head-meta {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  font-size: 12px; color: var(--text-t4);
}
.obj-card__type { text-transform: uppercase; letter-spacing: .04em; }
.obj-card__code { font-family: var(--font-mono); }
.obj-card__status { font-weight: 600; }
.obj-card__name { font-size: 18px; font-weight: 600; color: var(--text-t1); line-height: 1.3; }
.obj-card__amount { font-family: var(--font-mono); font-size: 15px; color: var(--money); }
.obj-card__actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 4px; }

.obj-card__section { display: flex; flex-direction: column; gap: 10px; }
.obj-card__section-title {
  margin: 0; font-size: 11px; font-weight: 600; letter-spacing: .08em;
  text-transform: uppercase; color: var(--text-t4);
}

.obj-card__ctx-grid {
  display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 10px 16px;
}
.obj-card__ctx-field { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.obj-card__ctx-label { font-size: 11px; color: var(--text-t5); }
.obj-card__ctx-value { font-size: 13px; color: var(--text-t2); overflow-wrap: anywhere; }

.obj-card__route { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.obj-card__route-step {
  padding: 4px 10px; border-radius: var(--r-pill, 20px); font-size: 11.5px; white-space: nowrap;
}
.obj-card__route-step--done { color: var(--text-t4); background: var(--surface-secondary); }
.obj-card__route-step--now  { color: var(--on-acc, #00120c); background: var(--accent-primary); font-weight: 600; }
.obj-card__route-step--next { color: var(--text-t5); border: 1px dashed var(--border-default); }

.obj-card__block-body { font-size: 13px; color: var(--text-t2); line-height: 1.5; }

.obj-card__related-list { display: flex; flex-direction: column; gap: 1px; }
.obj-card__related-row {
  display: flex; align-items: center; gap: 10px; padding: 8px 10px;
  border-radius: var(--r, 12px); text-decoration: none; color: inherit;
  transition: background 150ms;
}
.obj-card__related-row:hover { background: var(--surface-secondary); }
.obj-card__related-label { font-size: 12px; color: var(--text-t4); flex: 0 0 auto; }
.obj-card__related-value { font-size: 13px; color: var(--text-t2); flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.obj-card__related-arrow { color: var(--text-t5); font-size: 12px; flex: 0 0 auto; }

/* ── Registry + object-card split layout ──
   specs/MODULES_CATALOG.md: "клик по строке: карточка объекта справа
   (380px)". Wraps the registry list and a components/panel.js host; the
   host is only given the open modifier while a row is selected, so panel.js's
   own docked/overlay/sheet breakpoints (core-panel.css) take over the rest. */
.obj-card-layout { display: grid; grid-template-columns: 1fr; gap: var(--space-5, 20px); align-items: start; }
.obj-card-layout--open { grid-template-columns: 1fr 380px; }
.obj-card-layout__panel-host { min-height: 0; }
.obj-card-layout--open .obj-card-layout__panel-host { height: 100%; }
@media (max-width: 1023px) {
  .obj-card-layout--open { grid-template-columns: 1fr; }
}