.cs-widget-container-97781a68 {
    font-family: sans-serif;
    color: #333;
}
.cs-header-row {
    display: flex;
    padding: 10px 0;
    border-bottom: 2px dashed #eee;
    font-weight: 600;
    font-size: 14px;
}
.cs-module-header {
    display: flex;
    align-items: center;
    padding: 20px 0;
    border-bottom: 2px dashed #eee;
    flex-wrap: wrap;
}
.cs-lesson-row {
    display: flex;
    padding: 15px 0;
    align-items: center;
    flex-wrap: wrap;
}
.cs-col-lessons { width: 50%; display: flex; align-items: center; gap: 20px; flex-wrap: wrap; }
.cs-col-level { width: 20%; }
.cs-col-duration { width: 20%; }
.cs-col-action { width: 10%; text-align: right; }

.cs-module-tag {
    background: #e6f9eb;
    color: #28a745;
    padding: 5px 12px;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 500;
    white-space: nowrap;
}
h3.cs-module-title, .cs-module-title {
    margin: 0;
    font-size: 22px;
    font-weight: 500;
}
.cs-view-more-btn {
    background: #f1f1f1;
    color: #333;
    border: none;
    padding: 8px 16px;
    border-radius: 6px;
    cursor: pointer;
    font-size: 14px;
    transition: all 0.3s ease;
    white-space: nowrap;
}
.cs-lesson-title { padding-left: 100px; font-size: 15px; }
.cs-lesson-meta { color: #888; font-size: 14px; }
.cs-template-wrapper { padding: 20px 0; }
.cs-show-mobile { display: none; font-weight: 600; margin-right: 5px; }

/* Responsive Styling */
@media (max-width: 1024px) {
    .cs-col-lessons { width: 45%; }
    .cs-col-level { width: 20%; }
    .cs-col-duration { width: 20%; }
    .cs-col-action { width: 15%; }
    .cs-lesson-title { padding-left: 40px; }
}

@media (max-width: 767px) {
    .cs-hide-mobile { display: none !important; }
    .cs-show-mobile { display: inline-block; }
    
    .cs-col-lessons { width: 100%; margin-bottom: 15px; }
    .cs-col-level, .cs-col-duration { width: 50%; margin-bottom: 10px; }
    .cs-col-action { width: 100%; text-align: left; }
    
    .cs-module-header { flex-direction: column; align-items: flex-start; }
    .cs-module-info { width: 100%; margin-bottom: 15px; flex-direction: column; align-items: flex-start; gap: 10px; }
    
    .cs-lesson-row { flex-direction: column; align-items: flex-start; padding: 15px; background: #f9f9f9; border-radius: 8px; margin-bottom: 10px; }
    .cs-lesson-title { padding-left: 0; width: 100%; font-weight: 600; margin-bottom: 10px; }
    .cs-lesson-meta { width: 100%; margin-bottom: 5px; }
}
