/* Styles for src/components/lesson-card.js and nothing else. */

.lesson-card {
  display: flex;
  gap: var(--s-2);
  background: var(--c-window);
  border: 1px solid var(--c-button-border);
  padding: var(--s-2) var(--s-3);
  color: var(--c-text);
  text-decoration: none;
}
.lesson-card:hover { background: var(--c-row-hover); border-color: var(--c-highlight); color: var(--c-text); }
.lesson-card__num { flex: 0 0 22px; height: 22px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--c-button-border); background: var(--c-control); }
.lesson-card--done .lesson-card__num { color: var(--c-success); font-weight: 600; }
.lesson-card__body { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; }
.lesson-card__title { font-weight: 600; }
.lesson-card__goal { color: var(--c-text); }