.content-browser-learn-root{border:1px solid var(--color-secondary-400);border-radius:12px;flex-direction:column;width:100%;min-height:550px;margin-top:30px;display:flex;overflow:hidden}.content-browser-learn-wrapper{flex:1;display:flex}.content-browser-learn-wrapper .content-player-wrapper{background-color:var(--color-secondary-100);flex:1;justify-content:center;align-items:center;min-height:100%;padding:30px;display:flex;overflow:hidden}.content-player-wrapper .content-player{width:100%;height:100%;overflow:hidden}.content-player .content-list-header{display:none}.content-player .content-player-description{scrollbar-width:thin;scrollbar-color:var(--color-secondary-400) var(--color-secondary-100);max-height:100px;margin-top:20px;overflow-y:auto}.content-player .content-player-description h4{color:#fff;margin-bottom:5px;font-size:20px;font-weight:500}.content-player .content-player-description .content-player-about{color:var(--color-neutral-400);font-size:14px;font-weight:400}.content-player .content-player-description::-webkit-scrollbar{width:5px}.content-player .content-player-description::-webkit-scrollbar-thumb{background-color:var(--color-neutral-400)}.content-browser-learn-wrapper .content-list{background-color:var(--color-secondary-300);color:#fff;flex-direction:column;justify-content:space-between;width:300px;min-height:100%;padding:12px;display:flex}.content-list p{color:#fff;font-size:13px;font-weight:500}.content-list .content-list-header{border-bottom:1px solid var(--color-secondary-400);flex-direction:column;gap:8px;padding-bottom:12px;display:flex}.content-list-course-name,.content-player .content-list-course-name{font-size:20px;font-weight:600}.course-preview-link{text-underline-offset:4px;color:var(--color-neutral-100);align-items:center;gap:4px;font-size:14px;font-weight:400;text-decoration:underline;transition:all .2s;display:flex}.course-preview-link svg{width:12px;height:12px}.course-preview-link:hover{color:var(--color-primary-200)}.course-preview-link:hover svg{fill:var(--color-primary-200)}.content-list .content-list-items{flex-direction:column;gap:14px;max-height:380px;margin-top:12px;display:flex;overflow-y:auto}.content-list .content-list-items::-webkit-scrollbar{width:8px}.content-list .content-list-items::-webkit-scrollbar-track{background:var(--color-secondary-300);border-radius:4px}.content-list .content-list-items::-webkit-scrollbar-thumb{background:var(--color-secondary-400);border-radius:4px}.content-list .content-list-items::-webkit-scrollbar-thumb:hover{background:var(--color-secondary-500)}.content-list .content-list-item{background-color:var(--color-secondary-400);cursor:pointer;text-align:left;border-radius:6px;align-items:center;gap:20px;width:100%;min-height:45px;padding:10px;display:flex}.content-list .content-list-item-active{background-color:var(--color-primary-400)}.content-list .content-list-items-more{flex-direction:column;gap:12px;margin-top:12px;display:flex}.content-list .content-list-items-more p{font-size:20px;font-weight:600}@media screen and (max-width:1240px){.content-browser-learn-root{margin-top:20px}.content-list .content-list-items{gap:12px;max-height:300px}.content-list .content-list-item{min-height:40px;padding:8px}}@media screen and (max-width:768px){.content-browser-learn-wrapper{flex-direction:column-reverse}.content-browser-learn-wrapper .content-player-wrapper{padding:15px}.content-player .content-list-header{border-bottom:1px solid var(--color-secondary-400);color:#fff;flex-direction:column;gap:8px;margin-bottom:12px;padding-bottom:12px;display:flex}.content-player .content-list-header p{color:#fff;font-size:12px;font-weight:500}.content-browser-learn-wrapper .content-list{width:100%}.content-list .content-list-header{display:none}}
.content-browser-practice-tab{width:100%}.content-browser-practice-tab .section-header{justify-content:space-between;gap:12px;display:flex}.content-browser-practice-tab .tab-header{background-color:var(--color-secondary-100);cursor:pointer;border:2px solid var(--color-secondary-400);border-radius:16px;align-items:center;gap:8px;min-width:240px;padding:8px;display:flex}.content-browser-practice-tab .tab-header h3{color:#fff;font-size:16px;font-weight:500}.content-browser-practice-tab .tab-header.active{background-color:color-mix(in srgb, var(--color-primary-500) 30%, transparent);border:2px solid var(--color-primary-500)}.content-browser-practice-tab .section-content{border:1px solid var(--color-secondary-400);border-radius:16px;max-width:100%;margin-top:40px;padding:25px 0;overflow:hidden}.content-browser-practice-tab .section-content video{object-fit:cover;width:100%;height:100%}@media screen and (max-width:1024px){.content-browser-practice-tab .tab-header{min-width:120px}.content-browser-practice-tab .tab-header h3{font-size:14px}.content-browser-practice-tab .tab-header img{width:45px;height:45px}}@media screen and (max-width:768px){.content-browser-practice-tab .section-header{flex-wrap:wrap;justify-content:center}.content-browser-practice-tab .tab-header{min-width:240px}}@media screen and (max-width:480px){.content-browser-practice-tab .tab-header{width:160px;min-width:120px}}
.content-browser-ask-tab{width:100%}.content-browser-ask-tab .upcoming-classes-container{flex-wrap:wrap;justify-content:space-between;gap:20px;min-width:360px;display:flex}.content-browser-ask-tab .upcoming-class{background-color:var(--color-secondary-100);border:1px solid var(--color-secondary-400);cursor:pointer;border-radius:10px;align-items:center;width:250px;height:75px;padding:7px;display:flex}.content-browser-ask-tab .upcoming-class-date{border:1px solid var(--color-neutral-400);background-color:#fff;border-radius:10px;flex-direction:column;justify-content:center;align-items:center;gap:2px;width:55px;height:100%;padding:5px;display:flex}.content-browser-ask-tab .upcoming-class-date>span{line-height:16px}.content-browser-ask-tab .upcoming-class-date .month{text-transform:uppercase;color:#000;font-size:10px;font-weight:700}.content-browser-ask-tab .upcoming-class-date .day{color:var(--color-secondary-200);font-size:15px;font-weight:700}.content-browser-ask-tab .upcoming-class-date .date{color:#000;font-size:17px;font-weight:600}.content-browser-ask-tab .upcoming-class-info{color:var(--color-neutral-100);flex-direction:column;align-items:flex-start;gap:2px;margin-left:10px;display:flex}.content-browser-ask-tab .upcoming-class-name{text-align:start;font-size:15px;font-weight:600;line-height:15px}.content-browser-ask-tab .upcoming-class-time{text-align:start;color:var(--color-neutral-100);font-size:10px;font-weight:500}.content-browser-ask-tab .ask-video{border:1px solid var(--color-secondary-400);border-radius:16px;width:100%;height:100%;margin-top:40px;overflow:hidden}@media screen and (max-width:1024px){.content-browser-ask-tab .upcoming-classes-container{justify-content:center;min-width:100%}.content-browser-ask-tab .upcoming-class{width:235px}.content-browser-ask-tab .upcoming-class-name{font-size:13px}}@media screen and (max-width:768px){.content-browser-ask-tab .upcoming-classes-container{justify-content:center;min-width:100%}.content-browser-ask-tab .upcoming-class{width:100%}.content-browser-ask-tab .upcoming-class:not(:first-child){display:none}}
.content-browser-root{background-color:var(--color-secondary-200)}.content-browser-root .content-browser-wrapper{flex-direction:column;align-items:center;max-width:1200px;margin:0 auto;padding:96px 20px;display:flex}.content-browser-root .content-browser-body{width:100%}@media screen and (max-width:768px){.content-browser-root .content-browser-wrapper{padding:40px 15px}}
