.cf-course-grid-addon { margin: 0 -12px; }
.cf-lesson-card { background: #fff; border: 1px solid #e1e1e1; border-radius: 4px; padding: 8px; }
.cf-lesson-card.completed { opacity: 0.9; }
.cf-lesson-thumb { width: 100%; display: block; margin-bottom: 6px; }
.cf-lesson-title { font-size: 0.85rem; margin: 0 0 6px; }
.cf-lesson-meta {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 0.75rem;
  margin-bottom: 6px;
}
.cf-lesson-meta-icon {
  width: 14px;
  height: auto;
  vertical-align: middle;
}

.cf-lesson-button:hover { background: #2cd5c4; } 
.cf-lessons-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
@media (max-width: 768px) { .cf-lessons-grid { grid-template-columns: 1fr; } }
/* Styled completed badge with green circle and white check */
.cf-lesson-meta-completed {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  background-color: #12980B;
  color: #ffffff;
  border-radius: 50%;
  font-size: 0.75rem;
  font-weight: bold;
}

.cf-lesson-meta-type, .cf-lesson-meta-duration {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  background: none !important;
  color: #333 !important;
}

.cf-lesson-button {
  display: inline-block;
  background: #154957;
  color: #ffffff !important;
  padding: 4px 8px;
  border-radius: 4px;
  text-decoration: none;
  font-size: 0.75rem;
  text-align: left;
}
.cf-lesson-button:hover {
  background: #2cd5c4;
  color: #ffffff !important;
}