/**
 * SLA Theme - Responsive Utilities
 */

/* ============================================
   LearnDash Templates - 1200px max-width
   ============================================ */

/* Override WordPress core 1400px default for LearnDash pages */
body.single-sfwd-courses main.wp-block-group,
body.single-sfwd-lessons main.wp-block-group {
    --wp--style--global--content-size: 1200px;
}

/* Content blocks krijgen 1200px */
body.single-sfwd-courses main.wp-block-group > .wp-block-columns,
body.single-sfwd-courses main.wp-block-group > .wp-block-group:not(.sla-lesson-navigation),
body.single-sfwd-lessons main.wp-block-group > .wp-block-columns,
body.single-sfwd-lessons main.wp-block-group > .wp-block-group:not(.sla-lesson-navigation) {
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
}

/* ============================================
   Responsive - Hide/Show
   ============================================ */

/* Hide on mobile (768px and below) */
@media (max-width: 768px) {
    .sla-desktop-only {
        display: none !important;
    }
    
    .sla-lesson-sidebar .sl-chapter-list,
    .sla-lesson-sidebar .sl-lesson-topics-outline {
        display: none !important;
    }
    
    body.single-sfwd-lessons .sl-course-outline-mobile,
    body.single-sfwd-lessons .sl-mobile-bottom-bar {
        display: none !important;
    }
}

/* Hide on desktop (769px and above) */
@media (min-width: 769px) {
    .sla-mobile-only {
        display: none !important;
    }
}

/* Lesson sidebar sticky on desktop */
@media (min-width: 769px) {
    .sla-lesson-sidebar {
        position: sticky;
        top: 100px;
        align-self: flex-start;
    }
}

/* ============================================
   Lesson Navigation - Sticky (zelfde als topic)
   ============================================ */

/* Sticky navigation - mobile first (full width) */
.sla-lesson-navigation.is-sticky {
    position: fixed;
    bottom: 0;
    left: 0;
    z-index: 100;
    padding: 0;
    margin-top: 0;
    width: 100vw;
    box-sizing: border-box;
}

.sla-lesson-navigation.is-sticky .lesson-navigation {
    border-radius: 0;
    width: 100%;
    max-width: 100%;
    margin: 0;
    box-sizing: border-box;
}

/* Desktop navigation - centered with max-width */
@media (min-width: 769px) {
    .sla-lesson-navigation.is-sticky {
        width: 100%;
        max-width: 600px;
        left: 50%;
        transform: translateX(-50%);
        overflow: visible;
    }
    
    .sla-lesson-navigation.is-sticky .lesson-navigation {
        border-radius: 30px 30px 0 0;
        max-width: 100%;
        overflow: visible;
    }
}

/* ============================================
   Hide footer on lesson pages (nav is sticky)
   ============================================ */
body.single-sfwd-lessons footer,
body.single-sfwd-lessons .wp-block-template-part:last-child {
    display: none !important;
}