.wpcm-container {
width: min(1140px, calc(100% - 32px));
margin: 0 auto;
}
.wpcm-archive-wrap,
.wpcm-single-wrap {
padding: 40px 0;
}
.wpcm-page-header {
margin-bottom: 24px;
}
.wpcm-course-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 24px;
} .wpcm-course-card {
border: 1px solid #ddd;
border-radius: 16px;
overflow: hidden;  }
.single-course .wpcm-container aside.wpcm-course-sidebar {
background: #fff;
}
.wpcm-course-card__thumb {
display: block;
aspect-ratio: 16 / 9;
background: #f5f5f5;
}
.wpcm-course-card__thumb img {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
}
.wpcm-course-card__placeholder {
width: 100%;
height: 100%;
min-height: 220px;
background: linear-gradient(135deg, #f3f4f6, #e5e7eb);
}
.wpcm-course-card__content {
padding: 18px;
}
.wpcm-course-card__title {
font-size: 22px;
line-height: 1.3;
margin: 0 0 10px;
}
.wpcm-course-card__title a {
color: inherit;
text-decoration: none;
}
.wpcm-course-card__excerpt {
margin: 0;
color: #4b5563;
}
.wpcm-single-course {
max-width: 860px;
margin: 0 auto;
}
.wpcm-single-course__header {
margin-bottom: 24px;
}
.wpcm-single-course__video {
margin-bottom: 24px;
}
.wpcm-single-course__video video {
width: 100%;
height: auto;
border-radius: 16px;
}
.wpcm-single-course__actions {
margin-top: 24px;
}
.wpcm-button {
display: inline-flex;
align-items: center;
justify-content: center;
padding: 14px 22px;
border-radius: 10px;
background: #111827;
color: #fff;
text-decoration: none;
font-weight: 600;
}
.wpcm-pagination {
margin-top: 32px;
}
.wpcm-course-layout {
display: flex;
gap: 30px;
}
.wpcm-course-sidebar {
width: 260px;
border-right: 1px solid #eee;
}
.wpcm-course-tab {
padding: 12px;
border-bottom: 1px solid #f1f1f1;
cursor: pointer;
display: flex;
justify-content: space-between;
}
.wpcm-course-tab.active {
background: #c6bd73;
font-weight: 600;
}
.wpcm-course-tab.locked {
opacity: 0.5;
cursor: not-allowed;
}
.single-course .wpcm-container .wpcm-single-course__content p { 
margin: 0 0 10px !important;
}
.wpcm-course-sidebar .lock {
font-size: 12px;
}
.wpcm-single-course {
flex: 1;
}
.single-course .wpcm-container .wp-video {
width: 100% !important;
}
.single-course .wpcm-container .wp-video #mep_0 {
width: 100% !important;
}
.wpcm-course-layout { 
align-items: start;
position: relative;
}
.single-course .wpcm-container aside.wpcm-course-sidebar {
background: #fff;
height: auto;
position: sticky;
top: 0;
}
.single-course .wpcm-container .wpcm-single-course__content figure img {
width: 100%;
}
.single-course .wpcm-container .wpcm-single-course__content figure {
margin: 20px 0;
}
article.wpcm-single-course {
border: 1px solid #ddd;
padding: 20px; 
background: #fff;
}
.wpcm-course-layout .wpcm-single-course__actions {
margin-top: 24px; padding: 20px 0;
position: sticky;
bottom: 0;
}
.wpcm-course-layout .wpcm-single-course__actions a#wpcm-join-btn {
background: #B7995A;
padding: 10px 70px;
font-size: 20px;
}
.wpcm-course-layout .wpcm-single-course__actions a#wpcm-join-btn:hover{ 
color: #fff;
} .post-type-archive-course .wpcm-course-card { 
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.05);
}
@media (max-width: 991px){ }
@media (max-width: 767px){
.wpcm-course-layout { 
flex-wrap: wrap;
}
.single-course .wpcm-container aside.wpcm-course-sidebar {
width: 100%;
}
.single-course .wpcm-container article.wpcm-single-course { 
width: 100%;
}
.single-course .wpcm-container aside.wpcm-course-sidebar { 
position: relative; 
}
}
@media (max-width:575px){
.post-type-archive-course .wpcm-course-card .wpcm-course-card__thumb img { 
height: auto; 
}
}
@media (max-width: 767px) {
.wpcm-course-grid{
grid-template-columns: repeat(2, 1fr);
}
}
@media (max-width: 479px) { 
.wpcm-course-grid{ 
grid-template-columns: 1fr;
}
}