/* ─── CHXD Detail page (Material 3 Redesign) ─── */

.chxd-info-card {
  height: 100%;
}

.chxd-kv-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 8px 0;
}

.chxd-kv-item {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.chxd-kv-item .label {
  font-size: 0.75rem;
  font-weight: 500;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.chxd-kv-item .value {
  font-size: 1rem;
  font-weight: 600;
  color: var(--text-main);
  border-left: 3px solid var(--primary);
  padding-left: 12px;
}

/* ─── Skeleton ─── */
.skeleton-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.chxd-skeleton {
  animation: shimmer 1.5s infinite linear;
  background: linear-gradient(90deg, var(--surface-2) 25%, var(--border) 50%, var(--surface-2) 75%);
  background-size: 200% 100%;
}

@keyframes shimmer {
  0%   { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* ─── Utilities ─── */
.h-full { height: 100%; }
.items-center { align-items: center; }
.justify-between { justify-content: space-between; }

/* ─── Desktop Optimization (v1001.7) ─── */
@media (min-width: 1100px) {
  body.page-chxd-detail .plx-page {
    max-width: none !important;
    width: 100% !important;
    padding: 0 !important;
  }

  body.page-chxd-detail #main {
    padding: 0 !important;
  }

  body.page-chxd-detail .plx-layout-3-7 {
    padding: 24px 32px;
    gap: 24px;
    grid-template-columns: repeat(10, 1fr) !important;
  }
}