/* Compliance dashboard — Session 8A. Design-token only, zero gradients,
   zero inline styles. Mirrors the trust-accounts.css panel pattern. */

.ls-grade-card {
  display: flex;
  align-items: center;
  gap: var(--ls-space-6);
  padding: var(--ls-space-6) var(--ls-space-8);
  border-radius: var(--ls-radius-lg);
  border: 1px solid var(--ls-gray-100);
  background: var(--ls-white);
  box-shadow: var(--ls-shadow-sm);
}

.ls-grade-card__letter {
  font-family: var(--ls-font-display);
  font-size: 4rem;
  line-height: 1;
  font-weight: var(--ls-weight-bold);
  width: 96px;
  height: 96px;
  border-radius: var(--ls-radius-lg);
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--ls-gray-50);
  color: var(--ls-navy);
  flex-shrink: 0;
}

.ls-grade-card--a .ls-grade-card__letter { background: var(--ls-success-bg); color: var(--ls-success); }
.ls-grade-card--b .ls-grade-card__letter { background: var(--ls-success-bg); color: var(--ls-success); }
.ls-grade-card--c .ls-grade-card__letter { background: var(--ls-warning-bg); color: var(--ls-warning); }
.ls-grade-card--d .ls-grade-card__letter { background: var(--ls-warning-bg); color: var(--ls-warning-fg); }
.ls-grade-card--f .ls-grade-card__letter { background: var(--ls-danger-bg); color: var(--ls-danger); }
.ls-grade-card--unknown .ls-grade-card__letter { background: var(--ls-gray-50); color: var(--ls-gray-500); }

.ls-grade-card__title {
  font-family: var(--ls-font-display);
  font-size: var(--ls-text-2xl);
  font-weight: var(--ls-weight-bold);
  color: var(--ls-navy);
  margin: 0 0 var(--ls-space-1);
}

.ls-grade-card__score {
  font-size: var(--ls-text-base);
  color: var(--ls-gray-600);
  font-weight: var(--ls-weight-semibold);
  margin: 0 0 var(--ls-space-1);
}

.ls-grade-card__hint {
  font-size: var(--ls-text-sm);
  color: var(--ls-gray-500);
  margin: 0;
}

.ls-compliance-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--ls-space-6);
}

.ls-compliance-panel {
  background: var(--ls-white);
  border: 1px solid var(--ls-gray-100);
  border-radius: var(--ls-radius-lg);
  padding: var(--ls-space-5) var(--ls-space-6);
  box-shadow: var(--ls-shadow-sm);
  display: flex;
  flex-direction: column;
  gap: var(--ls-space-4);
}

.ls-compliance-panel__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--ls-space-3);
}

.ls-compliance-panel__title {
  font-family: var(--ls-font-display);
  font-size: var(--ls-text-lg);
  font-weight: var(--ls-weight-bold);
  color: var(--ls-navy);
  margin: 0;
  display: flex;
  align-items: center;
  gap: var(--ls-space-2);
}

.ls-compliance-panel__title svg {
  width: 18px;
  height: 18px;
  color: var(--ls-navy);
}

.ls-compliance-panel__stats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--ls-space-3);
  margin: 0;
}

.ls-compliance-panel__stats > div {
  background: var(--ls-off-white);
  padding: var(--ls-space-3) var(--ls-space-4);
  border-radius: var(--ls-radius-md);
}

.ls-compliance-panel__stats dt {
  font-size: var(--ls-text-xs);
  color: var(--ls-gray-500);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: var(--ls-weight-semibold);
  margin-bottom: var(--ls-space-1);
}

.ls-compliance-panel__stats dd {
  font-size: var(--ls-text-base);
  font-weight: var(--ls-weight-semibold);
  color: var(--ls-navy);
  margin: 0;
}

.ls-compliance-panel__empty {
  font-size: var(--ls-text-sm);
  color: var(--ls-gray-500);
  background: var(--ls-off-white);
  padding: var(--ls-space-4);
  border-radius: var(--ls-radius-md);
  margin: 0;
}

/* Status pills */
.ls-pill {
  display: inline-flex;
  align-items: center;
  padding: var(--ls-space-1) var(--ls-space-3);
  border-radius: var(--ls-radius-full);
  font-size: var(--ls-text-xs);
  font-weight: var(--ls-weight-semibold);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  white-space: nowrap;
}

.ls-pill--success { background: var(--ls-success-bg); color: var(--ls-success); }
.ls-pill--info    { background: var(--ls-info-bg);    color: var(--ls-info); }
.ls-pill--warning { background: var(--ls-warning-bg); color: var(--ls-warning-fg); }
.ls-pill--danger  { background: var(--ls-error-bg);   color: var(--ls-error-fg); }
.ls-pill--muted   { background: var(--ls-gray-50);    color: var(--ls-gray-500); }

@media (max-width: 1024px) {
  .ls-compliance-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 768px) {
  .ls-compliance-grid { grid-template-columns: 1fr; }
  .ls-grade-card { flex-direction: column; text-align: center; padding: var(--ls-space-5); }
  .ls-grade-card__letter { width: 80px; height: 80px; font-size: 3rem; }
  .ls-compliance-panel__stats { grid-template-columns: 1fr; }
}