$MAX-Z-INDEX : 2147483647 !default;
$o-wslides-tabs-height: 36px;
$o-wslides-color-bg: desaturate(map-get($grays, "200"), 80%);
$o-wslides-color-dark1: #47525f;
$o-wslides-color-dark2: #1f262d;
$o-wslides-color-dark3: #101216;
$o-wslides-fs-side-width: 300px;


// Common to new slides pages
// **************************************************
.o_wslides_gradient {
    background-image: linear-gradient(120deg, #875A7B, darken(#875A7B, 10%));
}

.o_wslides_course_pict {
    @include size(100%, 30%);
    padding-top: 30%;
    background-size: cover;
    background-position: center;

    @include media-breakpoint-up(md)  {
        @include size(100%);
        padding-top: 100%;
    }
}

.o_wslides_wrap {
    background-color: $o-wslides-color-bg;

    .o_wslides_home_nav {
        top: -40px;

        @include media-breakpoint-up(lg) {
            font-size: 1rem;

            .o_wslides_nav_navbar_right {
                padding-left: $spacer;
                margin-left: auto;
                border-left: 1px solid $border-color;
            }
        }
    }

    .o_wslides_course_card,
    .o_wslides_lesson_card {
        border-width: 0 0 3px 0;
    }

    .o_wslides_js_slide_like_up,
    .o_wslides_js_slide_like_down {
        &:not(.disabled) {
            cursor: pointer;
            color: $link-color;
        }
    }

    .o_wslides_js_lesson_quiz_question {
        .list-group-item  {
            font-size: 1rem;

            input:checked + i.fa-circle {
                color: $primary !important;
            }
        }

        &.disabled {
            opacity: 0.5;
            cursor: not-allowed;
        }
    }

    // tools
    // ****************************************
    .text_small_caps {
        font-variant: small-caps;
    }

    .o_wslides_entry_muted {
        opacity: 0.5;
    }

    // Truncate text descriptions to a specific number of lines.
    // If '-webkit-line-clamp' is not supported, a less effective
    // 'line-height' fallback will be used instead.
    $truncate-limits: 2, 3, 5, 10;

    @each $limit in $truncate-limits {
        .o_wslides_desc_truncate_#{$limit} {
            $line-height: 1.3;
            max-height: $limit * $line-height * 1em;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: normal;
            line-height: $line-height;
            display: -webkit-box;
            -webkit-box-orient: vertical;
            -webkit-line-clamp: $limit;
        }
    }
}

// New home page
// **************************************************
.o_wslides_home_main {
    .o_wslides_home_aside_loggedin {
        @include media-breakpoint-up(lg) {
            background: none;
            border: none;
        }
    }
}

// New course page
// **************************************************

@mixin o-wslides-tabs($tab-active-color: $o-wslides-color-bg) {
    margin-top: $o-wslides-tabs-height * -1;
    border-bottom: 0;

    .nav-link {
        border-radius: 0;
        border-width: 0 1px;
        @include o-hover-text-color(rgba(white, 0.8), white);

        &, &:hover {
            border-color: #875A7B;
            background: transparent;
        }

        &.active {
            color: $headings-color;
            background: $tab-active-color;
            border-color: $tab-active-color;
        }
    }
}

@mixin o-wslides-header-bar() {
    &:before {
        content: "";
        @include o-position-absolute(auto, 0, 0, 0);
        height: $o-wslides-tabs-height;
        background: rgba(black, 0.2);
    }
}

.o_wslides_course_nav {
    @include o-position-absolute(0,0,auto,0);
    border-width: 1px 0;

    &, .o_wslides_course_nav_search {
        background-color: rgba(white, 0.05);
        border-color: rgba(white, 0.1);
        border-style: solid;
    }

    .o_wslides_course_nav_search {
        border-width: 0 1px;
    }

    .breadcrumb-item.active a, .breadcrumb-item a:hover {
        color: white;
    }

    .breadcrumb-item a, .breadcrumb-item + .breadcrumb-item::before, .o_wslides_course_nav_search input::placeholder {
        color: rgba(white, 0.8);
    }
}


.o_wslides_course_header {
    @include media-breakpoint-up(md)  {
        @include o-wslides-header-bar();
    }
}

.o_wslides_course_doc_header {
    @include o-wslides-header-bar();
}

.o_wslides_course_main {
    .o_wslides_nav_tabs {
        @include media-breakpoint-up(md)  {
            @include o-wslides-tabs();
        }

        @include media-breakpoint-only(xs) {
            overflow-x: auto;
            overflow-y: hidden;
            line-height: 1.51;

            li {
                white-space: nowrap;
            }
        }
    }

    .o_wslides_doc_nav_tabs {
        @include o-wslides-tabs($gray-100);
    }

    .o_wslides_tabs_content {
        @include media-breakpoint-down(sm) {
            background-color: $nav-tabs-link-active-bg;
            padding:0 ($grid-gutter-width * 0.5);
        }

        @include media-breakpoint-only(xs) {
            margin: 0 ($grid-gutter-width * -0.5);
        }
    }

    // Slides list reordering widget
    .o_wslides_slides_list {
        .o_wslides_slide_list_category_header {
            z-index: 1;

            & + ul {
                z-index: 0;
            }
        }

        .o_text_link {
            text-decoration: none!important;

            > * {
                text-decoration: none!important;
                color: map-get($grays, "600");
            }

            &:hover > * {
                color: inherit;
            }
        }

        .o_wslides_slides_list_drag {
            cursor: pointer;

            i { opacity: 0.4; }
            &:hover i { opacity: 1; }
        }

        .o_wslides_slide_list_category_header, .o_wslides_slides_list_slide {
            border: 1px solid $border-color;
        }

        .o_wslides_slides_list_slide_hilight {
            background-color: #1252F3;
            height: 1px;
            z-index: 3;

            &:before, &:after {
                content: "";
                @include size(6px);
                display: block;
                border-radius: 100%;
                background-color: inherit;
                @include o-position-absolute(-2px, -2px);
            }

            &:after {
                right: auto;
                left: -2px;
            }
        }
    }
}


// New lesson page (not fullscreens)
// **************************************************
.o_wslides_lesson_main {
    .o_wslides_lesson_aside {
        .o_wslides_lesson_aside_collapse.collapsed {
            transform: rotate(90deg);
        }

        .o_wslides_lesson_aside_list {
            @include media-breakpoint-up (lg) {
                top: -58px;
            }
        }

        .o_wslides_lesson_aside_list {
            .o_wslides_lesson_aside_list_link {
                @include o-hover-text-color($gray-600, $headings-color );

                .o_wslides_lesson_link_name {
                    line-height: 1.2;
                }

                &.active {
                    box-shadow:inset 2px 0 theme-color('primary');
                }

                &:hover .o_wslides_lesson_link_name {
                    color: $headings-color;
                }
            }
        }
    }

    .o_wslides_lesson_content {
        .o_wslides_lesson_nav {
            .nav-link {
                background-color: transparent;
                border: 0;
                border-bottom: 1px solid $border-color;
                color: $gray-600;

                &.active {
                    border-bottom: 1px solid $success;
                    color: $gray-800;
                }
            }
        }
    }
}


// Modals
// **************************************************

.o_wslides_quiz_modal {
    @include media-breakpoint-up (sm) {
        .modal-body {
            overflow: visible!important;
        }

        .modal-content {
            height: 461px;

            .o_wslides_quiz_modal_hero {
                margin-left: -30px;
                position: absolute;
                margin-top: -45px;
            }
        }
    }
}


// Embed PDFViewer
// **************************************************
#PDFViewer.o_wslides_fs_pdf_viewer {
    background-image: linear-gradient(120deg, $o-wslides-color-dark2, $o-wslides-color-dark3);

    #PDFViewerNav {
        background-image: linear-gradient(120deg, $o-wslides-color-dark1, $o-wslides-color-dark2);
    }

    .oe_slides_panel_footer a, .oe_slides_share_bar a {
        @include o-hover-text-color(rgba(white, 0.7), white);

        &.disabled {
            @include o-hover-text-color(rgba(white, 0.2), rgba(white, 0.2));
            cursor: default;
        }
    }

    .oe_slide_embed_option {
        @include o-position-absolute(0,0,0,0);
    }
}

.oe_slides_share_bar{
    padding: 10px 0;
}

.oe_show_footer {
    z-index: $MAX-Z-INDEX; // Looks terrible but seems necessary due to fullscreen & canvas in PDFSlidesViewer
}