/* ============================================================
   utilities.css — helper classes
   ============================================================ */

.text-truncate-2 {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.text-truncate-1 {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.text-primary-c   { color: var(--text-primary) !important; }
.text-secondary-c { color: var(--text-secondary) !important; }
.text-muted-c     { color: var(--text-muted) !important; }
.text-gold        { color: var(--brand-secondary) !important; }
.text-success-c   { color: var(--status-active) !important; }
.text-danger-c    { color: var(--status-danger) !important; }
.text-warning-c   { color: var(--status-warning) !important; }

.fw-semibold { font-weight: 600 !important; }
.fw-bold     { font-weight: 700 !important; }

.cursor-pointer { cursor: pointer; }

.shadow-card { box-shadow: var(--card-shadow); }

.bg-gradient-blue {
  background: var(--gradient-ink);
}
.bg-gradient-navy {
  background: linear-gradient(160deg, #2B2740 0%, #1A1726 100%);
}
.bg-gradient-gold {
  background: var(--gradient-brand);
}

/* spacing helpers not covered by bootstrap defaults we rely on */
.gap-2  { gap: 8px; }
.gap-3  { gap: 16px; }
.gap-4  { gap: 24px; }

.divider {
  height: 1px;
  background: var(--card-border);
  border: none;
  margin: 20px 0;
}

.icon-inline {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.kpi-mono {
  font-family: var(--font-mono);
  font-weight: 500;
}

/* generic two-column layout for forms */
.form-layout {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: 24px;
  align-items: start;
}
@media (max-width: 991.98px) {
  .form-layout { grid-template-columns: 1fr; }
}

.detail-grid {
  display: grid;
  grid-template-columns: 1fr 2fr;
  gap: 24px;
  align-items: start;
}
@media (max-width: 991.98px) {
  .detail-grid { grid-template-columns: 1fr; }
}

/* info list (key/value) */
.info-list { display: flex; flex-direction: column; gap: 16px; }
.info-list__row { display: flex; flex-direction: column; gap: 2px; }
.info-list__label {
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--text-muted);
}
.info-list__value {
  font-size: 0.9375rem;
  color: var(--text-primary);
  font-weight: 500;
}