.dx-tab,.dx-tag {
    position: relative
}

.dx-tag {
    display: flex;
    align-items: center
}

.dx-tag::after {
    display: block;
    content: '';
    margin: 0 16px;
    width: 1px;
    height: 12px;
    background-color: var(--dx-font2-color)
}

.dx-tab {
    color: var(--dx-font2-color)
}

.dx-tab .view-video-page__ico {
    color: inherit
}

.dx-tab--active {
    color: var(--dx-primary-color)
}

.dx-tab--active::after {
    display: block;
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 2px;
    background-color: var(--dx-primary-color)
}

.video-comment>.video-comment-content .video-comment {
    padding: 0;
    margin-left: -20px
}

.video-comment>.video-comment-content .video-comment.dx-hairline--bottom:after {
    display: none
}

.video-comment.dx-hairline--bottom:last-child:after {
    display: none
}

.fixed-footer {
    background-color: var(--dx-base1-color)
}

#comment-input {
    width: 100%;
    outline: 0;
    border: 0
}

.share-container {
    display: none;
    align-items: center;
    width: 100%;
    min-width: 0
}

.share-container .btn-share__icon,.video-drop {
    position: relative
}

.share-container .btn-share__icon use.copy {
    opacity: 1
}

.share-container .btn-share__icon use.success {
    opacity: 0;
    pointer-events: none
}

.share-container.is-open {
    display: flex!important
}

.share-container.is-success .btn-share__icon use.copy {
    opacity: 0
}

.share-container.is-success .btn-share__icon use.success {
    opacity: 1;
    pointer-events: auto
}

.btn-show-share.is-open {
    color: var(--dx-primary-color)
}

.ql-editor .ql-code-block-container {
    background-color: var(--dx-base1-color)!important;
    padding: 12px!important
}

.ql-editor a {
    color: var(--dx-primary-color)!important
}

.video-drop .drop-content {
    top: inherit!important;
    bottom: 16px;
    z-index: 99;
    max-width: 365px;
    margin: 0;
    padding: 24px 0;
    right: 2px
}

/* .video-drop .drop-content-items::before {
    top: inherit;
    bottom: -16px;
    border-top: 8px solid #fff;
    border-bottom-color: transparent;
    right: 25px
} */

.drop-content {
    position: absolute;
    top: 16px;
    padding: 10px 10px 25px;
    font-size: 0;
    right: 0;
    margin: -5px -35% 0;
    min-width: 210px;
    max-width: 330px;
    pointer-events: none;
    height: auto;
    overflow: hidden;
    z-index: 10
}

.drop {
    cursor: pointer
}

.drop:hover .drop-content {
    pointer-events: auto;
    z-index: 20
}

.drop:hover .drop-content-box {
    transform: translateZ(0);
    opacity: 1
}

.drop-content-items {
    padding: 15px;
    position: relative;
    border-radius: 10px;
    background: #2b2b2b;
}

.drop-content-items::before {
    content: '';
    border-bottom-color: #fff;
    position: absolute;
    top: -8px;
    z-index: 20;
    right: 18px;
    width: 0;
    height: 0;
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    border-bottom: 8px solid rgba(7,7,10,.92)
}

.drop-content-box {
    transform: translate3d(0,-100%,0);
    opacity: 0;
    border-top-right-radius: 7px;
    box-shadow: 0 3px 12px rgba(0,0,0,.18);
    transition-duration: .3s
}

.drop:hover::before {
    content: '';
    position: absolute;
    top: 100%;
    width: 500%;
    right: 0;
    height: 25px
}

main.dx-container.app-content.view-video-main,main.dx-container.app-content:has(.view-video-page) {
    --view-video-page-gutter: 20px;
    padding-left: max(var(--view-video-page-gutter),env(safe-area-inset-left,0));
    padding-right: max(var(--view-video-page-gutter),env(safe-area-inset-right,0));
    max-width: min(1400px,100%);
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    box-sizing: border-box
}

@media (min-width: 1280px) {
    main.dx-container.app-content.view-video-main,main.dx-container.app-content:has(.view-video-page) {
        width:100%;
        max-width: min(1400px,100vw - 40px)
    }
}

.view-video-page {
    width: 100%
}

.view-video-page .dx-breadcrumbs {
    margin-bottom: 20px
}

main.view-video-main .comments .video-comment.px-3 {
    padding-left: 0;
    padding-right: 0
}

.view-video-page__tags {
    gap: 12.5px;
    margin-bottom: 20px
}

@media (min-width: 768px) {
    .view-video-page__tags {
        gap:20px
    }
}

@media (max-width: 767px) {
    .view-video-page__intro {
        box-sizing:border-box;
        width: 100%
    }
}

.view-video-page__ico {
    display: block;
    flex-shrink: 0;
    margin-right: 4px
}

.view-video-page__follow {
    border: 0!important;
    display: inline-flex;
    align-items: center;
    justify-content: center
}

.view-video-page__follow:hover {
    filter: brightness(1.06)
}

@media (max-width: 767px) {
    .view-video-page__follow {
        margin-top:0;
        margin-bottom: 0;
        padding: 8px 24px 7px;
        border-radius: 8px;
        background: linear-gradient(104deg,#d63b77 0,#c316e5 94%);
        align-self: center
    }
}

@media (min-width: 768px) {
    .view-video-page__follow {
        margin-top:0;
        margin-bottom: 0;
        height: auto;
        padding: 6px 23px;
        border-radius: 8px;
        font-size: 20px;
        font-weight: 500;
        line-height: 1.2;
        background: linear-gradient(103deg,#d63b77 0,#c316e5 95%)
    }

    .view-video-page {
        align-items: flex-start
    }
}

.view-video-page .video-item>a:nth-child(2) {
    color: #fff
}

.view-video-page .video-item>a:nth-child(2):hover {
    color: var(--dx-primary-color)
}

@media (min-width: 768px) {
    .dx-video-block-aside .video-item>a:nth-child(2) {
        font-size:16px!important;
        line-height: 1.4
    }

    .dx-video-block-aside .video-item>div:nth-child(4),.dx-video-block-aside .video-item>div:nth-child(6) {
        font-size: 14px!important
    }

    .dx-video-block-aside .video-item>div:nth-child(4) span,.dx-video-block-aside .video-item>div:nth-child(6) a,.dx-video-block-aside .video-item>div:nth-child(6) strong {
        font-size: inherit!important
    }
}

.dx-video-address-panel {
    background-color: var(--dx-base10-color);
    border: 1px solid var(--dx-base6-color);
    border-radius: 8px;
    overflow: hidden
}

.dx-video-address-panel__row {
    padding: 14px 16px;
    border-bottom: 1px solid rgba(48,48,48,.9)
}

.dx-video-address-panel__row--last,.dx-video-address-panel__row:last-child {
    border-bottom: 0
}
