/* Настройки */
.widget_lessonLastWatched {
    --wg_bg: #d9e9ff;
    --wg_lsBg: #6499e0;
    --wg_bulletBg: #f1157f;
    
    --wg_title: #070707;
    --wg_titleHover: #5167C0;
    --wg_module: #160b01;
    --wg_btn: rgba(81,104,192,0.4);
    --wg_btnHover: rgba(81,104,192,0.8);
    
    --font: inherit, sans-serif;
}


/* Виджет - ранее вы изучали */
.widget_lessonLastWatched {
    position: relative;
    margin-bottom: 30px;
    
    padding: 24px;
    border-radius: 10px;
    background: var(--wg_bg);
}


.widget_lessonLastWatched:has(.ls_course) > .widget__header {
    display: none;
}


.widget_lessonLastWatched h2 {
    margin-bottom: 20px;
    font-family: var(--font);
    font-size: 16px;
    font-weight: 600;
    line-height: 1.2;
}

.widget_lessonLastWatched h2.aM {
    margin-top: 30px;
}

.widget_lessonLastWatched .html-content ul {
    margin: 0 !important;
    padding: 0;
    list-style: none;
}

.widget_lessonLastWatched .ls_course .html-content ul {
    margin-bottom: 30px;
}

.widget_lessonLastWatched .html-content ul li {
    position: relative;
    margin-bottom: 20px;
    padding-left: 14px;
    padding-right: 50px;
}

.widget_lessonLastWatched .ls_main li {
    padding-right: 0 !important;
}

.widget_lessonLastWatched .ls_course li {
    border-radius: 10px;
    background: var(--wg_lsBg) url("data:image/svg+xml,%3Csvg width='60' height='98' viewBox='0 0 60 98' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cmask id='mask0_2194_278' style='mask-type:alpha' maskUnits='userSpaceOnUse' x='0' y='0' width='60' height='98'%3E%3Crect width='60' height='98' fill='%23F1F1F1'/%3E%3C/mask%3E%3Cg mask='url(%23mask0_2194_278)'%3E%3Ccircle cx='43.3534' cy='49.2773' r='37.7143' fill='%235167C0' fill-opacity='0.13'/%3E%3C/g%3E%3Cpath d='M35.9375 52.75L39.6875 49M39.6875 49L35.9375 45.25M39.6875 49L30.3125 49M46.25 49C46.25 55.2132 41.2132 60.25 35 60.25C28.7868 60.25 23.75 55.2132 23.75 49C23.75 42.7868 28.7868 37.75 35 37.75C41.2132 37.75 46.25 42.7868 46.25 49Z' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A") no-repeat right center;
    
    transition: all .3s;
}

.widget_lessonLastWatched .ls_course li a {
    display: inline-block;
    padding: 12px 0;
}

.widget_lessonLastWatched .ls_course li:hover {
    transform: translatey(-5px);
}

.widget_lessonLastWatched .html-content ul li:last-child {
    margin-bottom: 0;
}

.widget_lessonLastWatched .html-content ul li a::after {
    content: '';
    position: absolute;
    top: 8px;
    left: 0;
    
    width: 6px;
    height: 6px;
    
    background: var(--wg_bulletBg);
    border-radius: 10px;
    
    transition: transform .3s;
}

.widget_lessonLastWatched .ls_course .html-content ul li a::after {
    display: none;
}

.widget_lessonLastWatched .html-content ul li a:hover {
    text-decoration: none;
}

.widget_lessonLastWatched .watched_title {
    display: block;
    margin-bottom: 3px;
    
    font-family: var(--font);
    color: var(--wg_title);
    font-size: 16px;
    font-weight: 400;
    line-height: normal;
    
    transition: all .3s;
}

.widget_lessonLastWatched a:hover .watched_title {
    color: var(--wg_titleHover);
}

.widget_lessonLastWatched .watched_module {
    display: block;
    
    font-family: var(--font);
    color: var(--wg_module);
    font-size: 13px;
    font-weight: 300;
    line-height: normal;
}

.widget_lessonLastWatched .little_btn {
    display: inline-block;
    margin-top: 6px;
    font-family: var(--font);
    color: var(--wg_btn);
    font-size: 12px;
    font-weight: 400;
    line-height: normal;
    
    border-bottom: 1px solid var(--wg_btn);
    
    transition: all .3s;
}

.widget_lessonLastWatched a:hover .little_btn {
    color: var(--wg_btnHover);
    border-bottom: 1px solid var(--wg_btnHover);
}

/* ------------- 
content start - Поиск по тренингу через списки уроков
------------- */

/* Виджет - поиск по урокам тренинга */
:root {
  --search-font: Montserrat, sans-serif;
  
  --search_border: #AAC4C980;
  --search_bg: #AAC4C920;
  
  --search_title_size: clamp(16px, 4vw, 20px);
  --search_title_color: #6B929A;
  
  --search_input_bg: #fff;
  
  --search_btn_font_size: 14px;
  --search_btn_color: #fff;
  --search_btn_bg: #6B929A;
  --search_btn_bg_hover: #AAC4C9;
  
  --search_result_shadow: rgba(0, 0, 0, .05);
  --search_result_border: #f1f1f1;
  --search_result_bg: #fff;
  
  --search_result_item_color: #222;
  --search_result_item_border: #ececec;
  --search_result_item_hover_color: #fff;
  --search_result_item_hover_bg: #6B929A;
}

.search__block {
    padding: 24px;
    background: var(--search_bg);
    border: 1px solid var(--search_border);
    border-radius: 10px;
}

.search__title {
    margin-bottom: 10px;
    font-family: var(--search-font);
    font-style: normal;
    font-weight: 400;
    font-size: var(--search_title_size);
    color: var(--search_title_color);
}

.search__form {
    margin-bottom: 12px;
}

.search__form input {
    padding: 12px 8px;
    width: 100%;
    border: 1px solid transparent;
    border-radius: 5px;
    background: var(--search_input_bg)
}

.search__button {
    padding: 4px 12px;
    
    font-family: var(--search-font);
    font-weight: 400;
    font-size: var(--search_btn_font_size);
    color: var(--search_btn_color);
    
    border: none;
    border-radius: 5px;
    background: var(--search_btn_bg);
    
    transition: all .3s;
}

.search__button:hover {
    background: var(--search_btn_bg_hover);
}

.search__result {  
    position: absolute;
    bottom: 10px;
    left: 50%;
    transform: translatey(100%) translatex(-50%);
    z-index: 9999;
    
    padding: 16px;   
    max-height: 300px;
    width: calc(100% - 72px) !important;
    
    box-shadow: 0 0 10px 0 var(--search_result_shadow);
    border: 1px solid var(--search_result_border);
    border-radius: 10px;
    background: var(--search_result_bg);
    
    overflow: auto;
}

.search__result .result-item {
    margin-bottom: 4px;
}

.search__result .result-item a {
    display: block;
    padding: 4px 8px;
    font-family: var(--search-font);
    color: var(--search_result_item_color) !important;
    border: 1px solid var(--search_result_item_border);
    border-radius: 5px;
    
    transition: all .3s;
}

.search__result .result-item a:hover {
    text-decoration: none;
    color: var(--search_result_item_hover_color) !important;
    background: var(--search_result_item_hover_bg);
}
/* ------------- 
content finish - Поиск по тренингу через списки уроков
------------- */

/* ------------- 
content start - Тайм-коды" для видео блока от GetCourse
------------- */

.vhi-root:has(.block_time-codes) {
		--lesson_width: 840px;
		--main_color: 52,136,231;
		
    display: flex;
    flex-wrap: nowrap;
    justify-content: start;
    gap: 0;
    align-items: top;
    
    margin-bottom: 20px;
    padding-top: 0;
    height: calc(var(--lesson_width) / var(--video-aspect-ratio)) !important;
    
    overflow: hidden;
}

.vhi-root:has(.block_time-codes) iframe {
    position: static;
    width: calc(100% - 250px);
    background: #081a2f;
    border-radius: 10px 0 0 10px !important;
    transition: all .3s;
}

.vhi-root:has(.block_time-codes.closed) iframe {
    flex: 1 1 100% !important;
}

.vhi-root:has(.block_time-codes.opend) iframe {
    flex: 1 1 calc(100% - 270px) !important;
}

.vhi-root .block_time-codes  {
    position: relative;
    flex: 0 1 270px; 
    
    transition: all .3s;
}

.vhi-root .block_time-codes.closed {
    flex: 0 0 0;
    
    transition: all .3s;
}

.vhi-root .block_time-codes.closed * {
    font-size: 0;
    
    transition: all .3s;
}

.vhi-root .block_time-codes .overfill {
    border-radius: 0 10px 10px 0;
    overflow: hidden;
    display: block;
    height: 100%;
    
    transition: all .3s;
}

.vhi-root .block_time-codes .inner_Codes {
    background: #3B3B3B;
    height: 100%;
    
    overflow-y: scroll;
    
    transition: all .3s;
}

.vhi-root .block_time-codes.closed .inner_Codes {
    opacity: 0;
}

.vhi-root .block_time-codes .inner_Codes::-webkit-scrollbar {
  width: 3px;
  height: 8px;
  background-color: #aaa;
}

.vhi-root .block_time-codes .inner_Codes::-webkit-scrollbar-thumb {
  background: #000;
}

.vhi-root .block_time-codes.closed .inner_Codes {
    overflow: hidden;
}

.vhi-root .block_time-codes.closed .inner_Codes a {
    padding: 0;
}

.vhi-root .block_time-codes .open_timecodes {
    position: absolute;
    top: 10px;
    left: -10px;
    transform: translatex(-100%);

    min-width: 100px;
    padding: 6px 14px;
    color: #1C274C;
    font-family: Montserrat, sans-serif;
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    text-align: center;
    
    background: #fff;
    border-radius: 5px;
    border: 1px solid rgba(var(--main_color), .3);
    z-index: 10;
    
    cursor: pointer;
    
    transition: all .3s;
}

.vhi-root .block_time-codes .open_timecodes:hover {
	color: #fff;
	background: rgba(var(--main_color),1);
}

.vhi-root .block_time-codes.opend .open_timecodes {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='600' height='600' viewBox='0 0 600 600' fill='none'%3E%3Cpath d='M333.333 200L433.333 300M433.333 300L333.333 400M433.333 300H166.667M460 566.667H140C102.663 566.667 83.9933 566.667 69.7333 559.4C57.1899 553.01 46.99 542.81 40.6 530.267C33.3333 516.007 33.3333 497.337 33.3333 460V140C33.3333 102.663 33.3333 83.9947 40.6 69.734C46.99 57.1897 57.1899 46.991 69.7333 40.5997C83.9933 33.3333 102.663 33.3333 140 33.3333H460C497.337 33.3333 516.005 33.3333 530.266 40.5997C542.81 46.991 553.009 57.1897 559.4 69.734C566.667 83.9947 566.667 102.663 566.667 140V460C566.667 497.337 566.667 516.007 559.4 530.267C553.009 542.81 542.81 553.01 530.266 559.4C516.005 566.667 497.337 566.667 460 566.667Z' stroke='black' stroke-width='66.6667' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.vhi-root .block_time-codes a {
		position: relative;
    display: flex;
    justify-content: space-between;
    margin-bottom: 3px;
    padding: 16px 20px 16px 40px;
    
    color: #FFF;
    font-family: Montserrat, sans-serif;
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    text-decoration: none !important;
    
    background: rgba(255,255,255,0.1) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9' height='9' viewBox='0 0 9 9' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M4.5 9C6.98526 9 9 6.98526 9 4.5C9 2.01472 6.98526 0 4.5 0C2.01472 0 0 2.01472 0 4.5C0 6.98526 2.01472 9 4.5 9ZM3.91207 6.23061L6.03616 4.97655C6.38793 4.76883 6.38793 4.23117 6.03616 4.02345L3.91207 2.76939C3.57017 2.56752 3.15 2.83026 3.15 3.24592V5.75406C3.15 6.16972 3.57017 6.43248 3.91207 6.23061Z' fill='white'/%3E%3C/svg%3E") no-repeat 15px center;
    border-left: 4px solid rgba(var(--main_color),1);
    
    transition: all .3s;
}

.vhi-root .block_time-codes.closed a {
    display: none;
}

.vhi-root .block_time-codes a.active {
    background-color: rgba(var(--main_color),.7);
}

.vhi-root .block_time-codes a:hover {
    text-decoration: none;
    background-color: rgba(var(--main_color),0.1);
}

.vhi-root .block_time-codes a strong {
    font-weight: 500;
}

.timecode_progress {
    position: absolute;
    bottom: 0;
    left: -5px;
    height: 3px;
    width: calc(100% + 5px);
    padding-left: 1px;
}

.vhi-root .block_time-codes a.active .timecode_progressLine {
    display: block;
    height: 100%;
    background: rgba(255,255,255, .5);
    transition: all 4s;
}


@media (max-width: 992px) {
    .vhi-root:has(.block_time-codes) {
        height: calc((100vw - 70px) / var(--video-aspect-ratio)) !important;
    }
}

@media (max-width: 520px) {
    .vhi-root:has(.block_time-codes) {
        display: block;
        height: inherit !important;
        overflow: visible;
    }
    
    .vhi-root:has(.block_time-codes) iframe {
        width: 100%;
        height: calc(100vw / var(--video-aspect-ratio) - 40px) !important;
        border-radius: 10px !important;
    }
    
    .vhi-root .block_time-codes .open_timecodes {
        position: static;
        display: inline-block;
        
        margin: 10px 0;
        
        transform: none;
    }
    
    .vhi-root .block_time-codes {
        display: block;
    }
    
    .vhi-root .block_time-codes .overfill {
        border-radius: 10px;
    }
}

@media (max-width: 400px) {
    .vhi-root .block_time-codes a {
        gap: 10px 20px;
        font-size: 10px;
    }
}
/* ------------- 
content finish - Тайм-коды" для видео блока от GetCourse
------------- */



.vhi-root:has(.block_time-codes) {
		--lesson_width: 840px;
		--main_color: 52,136,231;
		
    display: flex;
    flex-wrap: nowrap;
    justify-content: start;
    gap: 0;
    align-items: top;
    
    margin-bottom: 20px;
    padding-top: 0;
    height: calc(var(--lesson_width) / var(--video-aspect-ratio)) !important;
    
    overflow: hidden;
}

.vhi-root:has(.block_time-codes) iframe {
    position: static;
    width: calc(100% - 250px);
    background: #081a2f;
    border-radius: 10px 0 0 10px !important;
    transition: all .3s;
}

.vhi-root:has(.block_time-codes.closed) iframe {
    flex: 1 1 100% !important;
}

.vhi-root:has(.block_time-codes.opend) iframe {
    flex: 1 1 calc(100% - 270px) !important;
}

.vhi-root .block_time-codes  {
    position: relative;
    flex: 0 1 270px; 
    
    transition: all .3s;
}

.vhi-root .block_time-codes.closed {
    flex: 0 0 0;
    
    transition: all .3s;
}

.vhi-root .block_time-codes.closed * {
    font-size: 0;
    
    transition: all .3s;
}

.vhi-root .block_time-codes .overfill {
    border-radius: 0 10px 10px 0;
    overflow: hidden;
    display: block;
    height: 100%;
    
    transition: all .3s;
}

.vhi-root .block_time-codes .inner_Codes {
    background: #3B3B3B;
    height: 100%;
    
    overflow-y: scroll;
    
    transition: all .3s;
}

.vhi-root .block_time-codes.closed .inner_Codes {
    opacity: 0;
}

.vhi-root .block_time-codes .inner_Codes::-webkit-scrollbar {
  width: 3px;
  height: 8px;
  background-color: #aaa;
}

.vhi-root .block_time-codes .inner_Codes::-webkit-scrollbar-thumb {
  background: #000;
}

.vhi-root .block_time-codes.closed .inner_Codes {
    overflow: hidden;
}

.vhi-root .block_time-codes.closed .inner_Codes a {
    padding: 0;
}

.vhi-root .block_time-codes .open_timecodes {
    position: absolute;
    top: 10px;
    left: -10px;
    transform: translatex(-100%);

    min-width: 100px;
    padding: 6px 14px;
    color: #1C274C;
    font-family: Montserrat, sans-serif;
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    text-align: center;
    
    background: #fff;
    border-radius: 5px;
    border: 1px solid rgba(var(--main_color), .3);
    z-index: 10;
    
    cursor: pointer;
    
    transition: all .3s;
}

.vhi-root .block_time-codes .open_timecodes:hover {
	color: #fff;
	background: rgba(var(--main_color),1);
}

.vhi-root .block_time-codes.opend .open_timecodes {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='600' height='600' viewBox='0 0 600 600' fill='none'%3E%3Cpath d='M333.333 200L433.333 300M433.333 300L333.333 400M433.333 300H166.667M460 566.667H140C102.663 566.667 83.9933 566.667 69.7333 559.4C57.1899 553.01 46.99 542.81 40.6 530.267C33.3333 516.007 33.3333 497.337 33.3333 460V140C33.3333 102.663 33.3333 83.9947 40.6 69.734C46.99 57.1897 57.1899 46.991 69.7333 40.5997C83.9933 33.3333 102.663 33.3333 140 33.3333H460C497.337 33.3333 516.005 33.3333 530.266 40.5997C542.81 46.991 553.009 57.1897 559.4 69.734C566.667 83.9947 566.667 102.663 566.667 140V460C566.667 497.337 566.667 516.007 559.4 530.267C553.009 542.81 542.81 553.01 530.266 559.4C516.005 566.667 497.337 566.667 460 566.667Z' stroke='black' stroke-width='66.6667' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.vhi-root .block_time-codes a {
		position: relative;
    display: flex;
    justify-content: space-between;
    margin-bottom: 3px;
    padding: 16px 20px 16px 40px;
    
    color: #FFF;
    font-family: Montserrat, sans-serif;
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    text-decoration: none !important;
    
    background: rgba(255,255,255,0.1) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9' height='9' viewBox='0 0 9 9' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M4.5 9C6.98526 9 9 6.98526 9 4.5C9 2.01472 6.98526 0 4.5 0C2.01472 0 0 2.01472 0 4.5C0 6.98526 2.01472 9 4.5 9ZM3.91207 6.23061L6.03616 4.97655C6.38793 4.76883 6.38793 4.23117 6.03616 4.02345L3.91207 2.76939C3.57017 2.56752 3.15 2.83026 3.15 3.24592V5.75406C3.15 6.16972 3.57017 6.43248 3.91207 6.23061Z' fill='white'/%3E%3C/svg%3E") no-repeat 15px center;
    border-left: 4px solid rgba(var(--main_color),1);
    
    transition: all .3s;
}

.vhi-root .block_time-codes.closed a {
    display: none;
}

.vhi-root .block_time-codes a.active {
    background-color: rgba(var(--main_color),.7);
}

.vhi-root .block_time-codes a:hover {
    text-decoration: none;
    background-color: rgba(var(--main_color),0.1);
}

.vhi-root .block_time-codes a strong {
    font-weight: 500;
}

.timecode_progress {
    position: absolute;
    bottom: 0;
    left: -5px;
    height: 3px;
    width: calc(100% + 5px);
    padding-left: 1px;
}

.vhi-root .block_time-codes a.active .timecode_progressLine {
    display: block;
    height: 100%;
    background: rgba(255,255,255, .5);
    transition: all 4s;
}


@media (max-width: 992px) {
    .vhi-root:has(.block_time-codes) {
        height: calc((100vw - 70px) / var(--video-aspect-ratio)) !important;
    }
}

@media (max-width: 520px) {
    .vhi-root:has(.block_time-codes) {
        display: block;
        height: inherit !important;
        overflow: visible;
    }
    
    .vhi-root:has(.block_time-codes) iframe {
        width: 100%;
        height: calc(100vw / var(--video-aspect-ratio) - 40px) !important;
        border-radius: 10px !important;
    }
    
    .vhi-root .block_time-codes .open_timecodes {
        position: static;
        display: inline-block;
        
        margin: 10px 0;
        
        transform: none;
    }
    
    .vhi-root .block_time-codes {
        display: block;
    }
    
    .vhi-root .block_time-codes .overfill {
        border-radius: 10px;
    }
}

@media (max-width: 400px) {
    .vhi-root .block_time-codes a {
        gap: 10px 20px;
        font-size: 10px;
    }
}