/* LMS family — shared dashboard shell, a11y, and presentation bridges */

.lms-family-page {
  background: var(--lms-bg-page);
  color: var(--color-text);
}

.lms-family-page .lms-nav-link,
.lms-family-page .lms-sidebar-toggle,
.lms-family-page .lms-quick-action,
.lms-family-page .nav-links a,
.lms-family-page .btn,
.lms-family-page .qc-card,
.lms-family-page .qc-card-rich,
.lms-family-page .lms-stat-card,
.lms-family-page .qc-toolbar input,
.lms-family-page .qc-toolbar select,
.lms-family-page .lms-toolbar input,
.lms-family-page .lms-toolbar select {
  min-height: 44px;
}

.lms-family-page .theme-toggle,
.lms-family-page .nav-toggle,
.lms-family-page .site-footer .footer-social a {
  width: 44px;
  height: 44px;
}

.lms-family-page a:focus-visible,
.lms-family-page button:focus-visible,
.lms-family-page input:focus-visible,
.lms-family-page select:focus-visible,
.lms-family-page .qc-card:focus-visible,
.lms-family-page .qc-card-rich:focus-visible,
.lms-family-page .ml-item:focus-visible {
  outline: 2px solid var(--color-focus-ring);
  outline-offset: 2px;
}

/* Shared hero typography */
.lms-family-page .qc-eyebrow {
  color: var(--lms-hero-eyebrow);
}

.lms-family-page .qc-hero h1,
.lms-family-page .ml-hero h1 {
  color: var(--lms-hero-title);
}

.lms-family-page .qc-lede {
  color: var(--lms-hero-lede);
}

/* Progress bars — shared tokenized track/fill */
.lms-family-page .qc-progress-track {
  background: var(--lms-progress-track);
}

.lms-family-page .qc-progress-fill {
  background: var(--lms-progress-fill);
  box-shadow: var(--lms-progress-glow);
}

/* Empty states align with shared card-empty language */
.lms-family-page .ml-empty-state,
.lms-family-page .qc-empty {
  border: 1px dashed var(--lms-empty-border-strong);
  border-radius: var(--radius-medium);
  background: var(--lms-empty-bg);
  color: var(--lms-empty-text);
}

.lms-family-page .ml-empty {
  color: var(--lms-empty-text);
}

/* Loading skeleton */
.lms-family-page .qc-skeleton {
  border-radius: var(--radius-medium);
  background: var(--lms-skeleton-bg);
  background-size: 200% 100%;
}

/* Toast uses alert-success tokens */
.lms-family-page .lms-toast {
  border: 1px solid var(--lms-toast-success-border);
  background: var(--lms-toast-success-bg);
  color: var(--lms-toast-success-text);
}

.lms-family-page .lms-loading {
  padding: var(--space-4) var(--space-5);
  border: 1px solid var(--alert-info-border, var(--color-border));
  border-radius: var(--radius-medium);
  background: var(--alert-info-bg, var(--color-primary-muted));
  color: var(--alert-info-text, var(--color-primary));
  font-size: 0.95rem;
}

/* Leaderboard table — shared table chrome */
.lms-family-page .leaderboard-table {
  width: 100%;
  border: 1px solid var(--table-border);
  border-radius: var(--table-radius);
  border-collapse: separate;
  border-spacing: 0;
  background: var(--table-background);
  overflow: hidden;
}

.lms-family-page .leaderboard-table th,
.lms-family-page .leaderboard-table td {
  padding: var(--table-padding-compact) var(--table-padding);
  border-bottom: 1px solid var(--table-divider);
  text-align: left;
}

.lms-family-page .leaderboard-table th {
  background: var(--table-header-background);
  color: var(--table-heading);
  font-weight: 700;
}

.lms-family-page .leaderboard-table tr:last-child td {
  border-bottom: 0;
}

.lms-family-page .table-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.lms-cert-ladder {
  margin: 12px 0 0;
  color: var(--lms-muted-text, #9fb0d0);
  font-size: 0.85rem;
  line-height: 1.45;
}

.cert-practice-disclaimer {
  margin: 12px 0 0;
  max-width: 52rem;
  color: var(--lms-muted-text, #9fb0d0);
  font-size: 0.875rem;
  line-height: 1.5;
}

.cert-practice-disclaimer--panel {
  margin: 0 0 18px;
  padding: 12px 14px;
  border-radius: var(--radius-md, 10px);
  border: 1px solid rgba(148, 163, 184, 0.18);
  background: rgba(15, 23, 42, 0.35);
}

@media (prefers-reduced-motion: reduce) {
  .lms-family-page .qc-skeleton {
    animation: none;
  }
}
