/* fsq-cards.css - detail cards: summary, specifications, recent-activity table (CMP-320 / 321 / 322). Adapted from the mERP UI library; provenance in the FSQ Brain (brain/ui/fsq_ui_registry.md). */

.fsq-detail-head { display: flex; justify-content: space-between; align-items: flex-start; flex-wrap: wrap; gap: 8px; margin-bottom: 1.5rem; }
.fsq-detail-head h1 { font-size: 1.75rem; font-weight: 700; margin: 0 0 4px; }
.fsq-detail-meta { color: var(--fsq-text-muted); font-size: .9rem; margin: 0; }
.fsq-detail-meta .fsq-detail-id { font-weight: 500; color: var(--fsq-brand); }
.fsq-detail-meta .fsq-sep { margin: 0 8px; }
.fsq-detail-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.fsq-detail-actions .btn { min-height: 38px; display: inline-flex; align-items: center; }

.fsq-card-title { font-size: .95rem; }
.fsq-card-title i { margin-right: 8px; color: var(--fsq-brand); }

/* Label above value (CMP-320 / CMP-321) */
.fsq-kv-label { color: var(--fsq-text-muted); font-size: .875rem; margin-bottom: 4px; }
.fsq-kv-value { font-weight: 600; color: var(--fsq-text); overflow-wrap: anywhere; }
.fsq-kv-stat { font-weight: 700; font-size: 1.5rem; color: var(--fsq-brand); line-height: 1.2; }

/* Recent-activity table (CMP-322) */
.fsq-activity { font-size: .88rem; }
.fsq-activity thead th {
  font-size: .75rem; text-transform: uppercase; letter-spacing: .5px; color: var(--fsq-text-muted); white-space: nowrap;
}
/* The shell forces .table-light th to #6b7280 with !important in dark (about 3:1); this keeps the header readable. */
[data-merp-theme="dark"] .fsq-activity thead th { color: #aab3c2 !important; }
.fsq-activity .fsq-delta-good { font-weight: 600; color: var(--fsq-ok-fg); }
.fsq-activity .fsq-delta-bad { font-weight: 600; color: var(--fsq-danger-fg); }

@media (max-width: 575px) {
  .fsq-detail-head h1 { font-size: 1.4rem; }
}