.lesson-thumb {
      height: 220px;
      background: #f0f0f0;
      display: flex;
      align-items: center;
      justify-content: center;
      border-top-left-radius: 0.5rem;
      border-top-right-radius: 0.5rem;
      overflow: hidden;
    }
    
    .lesson-thumb img {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
    
    .lesson-item {
      transition: 0.3s;
    }
    
    /* Modern Discussion Forum Styles */
    .forum-container {
      background: #fff;
      border-radius: 12px;
      box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
      overflow: hidden;
    }
    
    .forum-header {
      padding: 1.5rem;
      border-bottom: 1px solid #f0f0f0;
      background: #fafafa;
    }
    
    .comment-card {
      border: none;
      border-radius: 12px;
      box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
      transition: all 0.2s ease;
      margin-bottom: 1.25rem;
    }
    
    .comment-card:hover {
      box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
      transform: translateY(-2px);
    }
    
    .comment-header {
      display: flex;
      align-items: center;
      margin-bottom: 0.75rem;
    }
    
    .user-avatar {
      width: 40px;
      height: 40px;
      border-radius: 50%;
      object-fit: cover;
      margin-right: 12px;
      background-color: #e9ecef;
      display: flex;
      align-items: center;
      justify-content: center;
      font-weight: 600;
      color: #6c757d;
    }
    
    .comment-meta {
      flex-grow: 1;
    }
    
    .comment-actions {
      display: flex;
      gap: 12px;
    }
    
    .action-btn {
      background: none;
      border: none;
      color: #6c757d;
      font-size: 0.875rem;
      cursor: pointer;
      padding: 4px 8px;
      border-radius: 4px;
      transition: all 0.2s ease;
    }
    
    .action-btn:hover {
      background: #f8f9fa;
      color: #2F6B78;
    }
    
    .replies-container {
      margin-left: 52px;
      padding-left: 1rem;
      border-left: 2px solid #e9ecef;
    }
    
    .add-comment-btn {
      background: linear-gradient(45deg, #2F6B78, #0a58ca);
      border: none;
      border-radius: 8px;
      padding: 0.5rem 1.25rem;
      font-weight: 600;
      transition: all 0.2s ease;
      display: flex;
      align-items: center;
      gap: 8px;
    }
    
    .add-comment-btn:hover {
      transform: translateY(-2px);
      box-shadow: 0 4px 12px rgba(13, 110, 253, 0.25);
    }
    
    .empty-state {
      text-align: center;
      padding: 3rem 1rem;
      color: #6c757d;
    }
    
    .empty-state i {
      font-size: 3rem;
      margin-bottom: 1rem;
      color: #dee2e6;
    }
    
    .comment-form {
      background: #f8f9fa;
      border-radius: 12px;
      padding: 1.5rem;
      margin-top: 1.5rem;
    }
    
    .form-control:focus {
      box-shadow: 0 0 0 3px rgba(13, 110, 253, 0.15);
    }
    
    .badge-count {
      background: #2F6B78;
      color: white;
      border-radius: 50%;
      width: 24px;
      height: 24px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      font-size: 0.75rem;
      margin-left: 8px;
    }

    .btn-viewLesson {
      color: white;
      background-color: #154980;
    }

    .btn-viewLesson:hover {
      color: white;
      transform: translateY(-2px);
      box-shadow: 0 4px 10px #2F6B78;
    }

    .breadcrumb-custom {
      background: rgba(255,255,255,0.95);
      border-radius: 10px;
      padding: 15px 20px;
      margin-bottom: 30px;
      box-shadow: 0 5px 15px rgba(0,0,0,0.05);
      border: 1px solid rgba(21, 73, 128, 0.1);
    }
    
    .breadcrumb-custom a {
      text-decoration: none;
      color: #6c757d;
      transition: color 0.3s ease;
    }
    
    .breadcrumb-custom a:hover {
      color: #154980;
    }