/*
 * Navbar Fix - Ensures navigation bar stays visible when scrolling
 * This file can be included in any page that has navbar visibility issues
 *
 * @package   theme_remui_kids
 * @copyright 2025 Kodeit
 * @license   http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
 */

/* ========================================
   GLOBAL NAVBAR FIX - ALWAYS STICKY
   (Excludes course view pages)
   ======================================== */

/* Make navbar fixed at top with high z-index - NOT on course pages */
body:not(.path-course-view) nav.navbar,
body:not(.path-course-view) .navbar.fixed-top,
body:not(.path-course-view) .navbar-fixed-top,
body:not(.path-course-view) header.navbar,
body:not(.path-course-view) nav[aria-label*="menu"],
body:not(.path-course-view) nav[class*="navbar"] {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    z-index: 1100 !important;
    background: #ffffff !important;
    border-bottom: 1px solid #e5e7eb !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) !important;
    transition: all 0.2s ease !important;
    will-change: transform !important;
    -webkit-backface-visibility: hidden !important;
    backface-visibility: hidden !important;
}

/* Ensure navbar content is visible - NOT on course pages */
body:not(.path-course-view) nav.navbar .navbar-nav,
body:not(.path-course-view) nav.navbar .navbar-brand,
body:not(.path-course-view) nav.navbar .usermenu,
body:not(.path-course-view) nav.navbar .primary-navigation {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Dropdown menus should be above everything - NOT on course pages */
body:not(.path-course-view) .navbar .dropdown-menu,
body:not(.path-course-view) .nav-item .dropdown-menu,
body:not(.path-course-view) .navbar-nav .dropdown-menu {
    z-index: 1200 !important;
}

/* ========================================
   PAGE CONTENT PADDING
   (Excludes course view pages)
   ======================================== */

/* Add proper padding to prevent content from being hidden under fixed navbar - NOT on course pages */
body:not(.path-course-view) {
    padding-top: 0 !important;
}

/* Dashboard pages - no extra padding (override standard padding) - NOT on course pages */
body.path-my:not(.path-course-view) #page-wrapper,
body.path-dashboard:not(.path-course-view) #page-wrapper,
body.has-student-sidebar:not(.path-course-view) #page-wrapper,
body.custom-dashboard-page:not(.path-course-view) #page-wrapper {
    padding-top: 0 !important;
}

body.path-my:not(.path-course-view) #page,
body.path-dashboard:not(.path-course-view) #page,
body.has-student-sidebar:not(.path-course-view) #page,
body.custom-dashboard-page:not(.path-course-view) #page {
    padding-top: 0 !important;
}

body.path-my:not(.path-course-view) .main-inner,
body.path-dashboard:not(.path-course-view) .main-inner,
body.has-student-sidebar:not(.path-course-view) .main-inner,
body.custom-dashboard-page:not(.path-course-view) .main-inner {
    padding-top: 0 !important;
}

/* Middle dashboard - 60px padding - NOT on course pages */
body.middle-dashboard:not(.path-course-view) {
    padding-top: 60px !important;
}

body.middle-dashboard:not(.path-course-view) #page-wrapper,
body.middle-dashboard:not(.path-course-view) #page,
body.middle-dashboard:not(.path-course-view) .main-inner {
    padding-top: 0 !important;
}

body:not(.path-course-view) #page {
    padding-top: 0 !important;
}

body:not(.path-course-view) .main-inner {
    padding-top: 0 !important;
}

/* Ensure page content is visible below navbar - NOT on course pages */
body:not(.path-course-view) #region-main,
body:not(.path-course-view) #region-main-box,
body:not(.path-course-view) .page-content {
    padding-top: 0 !important;
}

/* ========================================
   CUSTOM SIDEBAR PAGES (Teacher, Admin, etc.)
   (Excludes course view pages)
   ======================================== */

/* Pages with custom sidebars - NOT on course pages */
body:not(.path-course-view) .teacher-css-wrapper,
body:not(.path-course-view) .admin-sidebar-wrapper {
    padding-top: 0 !important;
}

/* Sidebar toggle buttons should be below navbar - NOT on course pages */
body:not(.path-course-view) .sidebar-toggle {
    top: 80px !important;
    z-index: 1001 !important;
}

/* Custom sidebars should start below navbar - 60px padding - NOT on course pages */
body:not(.path-course-view) .teacher-sidebar,
body:not(.path-course-view) .admin-sidebar {
    padding-top: 0px !important;
}

/* ========================================
   MOBILE RESPONSIVE
   (Excludes course view pages)
   ======================================== */

@media (max-width: 768px) {

    /* Navbar stays fixed on mobile - NOT on course pages */
    body:not(.path-course-view) nav.navbar {
        position: fixed !important;
        top: 0 !important;
        z-index: 1100 !important;
    }

    /* Dashboard pages on mobile - no extra padding (override standard padding) - NOT on course pages */
    body.path-my:not(.path-course-view) #page-wrapper,
    body.path-dashboard:not(.path-course-view) #page-wrapper,
    body.has-student-sidebar:not(.path-course-view) #page-wrapper,
    body.custom-dashboard-page:not(.path-course-view) #page-wrapper {
        padding-top: 0 !important;
    }

    body.path-my:not(.path-course-view) #page,
    body.path-dashboard:not(.path-course-view) #page,
    body.has-student-sidebar:not(.path-course-view) #page,
    body.custom-dashboard-page:not(.path-course-view) #page {
        padding-top: 0 !important;
    }

    /* Middle dashboard on mobile - 60px padding - NOT on course pages */
    body.middle-dashboard:not(.path-course-view) {
        padding-top: 60px !important;
    }

    body.middle-dashboard:not(.path-course-view) #page-wrapper,
    body.middle-dashboard:not(.path-course-view) #page {
        padding-top: 0 !important;
    }


    body:not(.path-course-view) #page {
        padding-top: 0 !important;
    }

    /* Mobile sidebar toggles - NOT on course pages */
    body:not(.path-course-view) .sidebar-toggle {
        top: 65px !important;
    }
}

/* ========================================
   SCROLLED STATE ENHANCEMENT
   (Excludes course view pages)
   ======================================== */

/* Add shadow when page is scrolled - NOT on course pages */
body:not(.path-course-view) nav.navbar.scrolled {
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15) !important;
    background: rgba(255, 255, 255, 0.98) !important;
}

/* ========================================
   DARK MODE SUPPORT
   (Excludes course view pages)
   ======================================== */

body[data-theme="dark"]:not(.path-course-view) nav.navbar,
body.dark-mode:not(.path-course-view) nav.navbar {
    background: #1a1a1a !important;
    border-bottom-color: #333 !important;
}

/* ========================================
   PRINT STYLES
   ======================================== */

@media print {
    nav.navbar {
        position: static !important;
    }

    #page-wrapper,
    #page,
    .main-inner,
    .teacher-main-content,
    .admin-main-content {
        padding-top: 0 !important;
    }
}

/* ========================================
   HIGH SCHOOL DASHBOARD SPECIFIC FIX
   (Excludes course view pages)
   ======================================== */

/* HIGH SCHOOL DASHBOARD SPECIFIC FIX - Maximum Priority - NOT on course pages */
body:not(.path-course-view) .highschool-dashboard,
body:not(.path-course-view) .custom_dashboard .highschool-dashboard,
body.custom-dashboard-page:not(.path-course-view) .highschool-dashboard,
body.custom-dashboard-page:not(.path-course-view) .custom_dashboard .highschool-dashboard,
body:not(.path-course-view) div.highschool-dashboard,
body:not(.path-course-view) .custom_dashboard>div.highschool-dashboard,
body.custom-dashboard-page:not(.path-course-view) div.highschool-dashboard {
    margin-top: 60px !important;
    padding-top: 0px !important;
}

/* OVERRIDE ENHANCED SIDEBAR SPECIFIC SELECTORS - NOT on course pages */
body.has-student-sidebar.has-enhanced-sidebar:not(.path-course-view) .highschool-dashboard,
body.has-student-sidebar.has-enhanced-sidebar:not(.path-course-view) .analytics-dashboard,
body.has-student-sidebar.has-enhanced-sidebar:not(.path-course-view) .dashboard-metrics {
    margin-top: 60px !important;
    padding-top: 0px !important;
}

/* SIDEBAR FIX - Prevent cutting from top - NOT on course pages */

body.has-student-sidebar.has-enhanced-sidebar:not(.path-course-view) .student-sidebar,
body.has-enhanced-sidebar.student-sidebar:not(.path-course-view) .student-sidebar {
    margin-top: 80px !important;
    padding-top: 0px !important;
}

/* ========================================
   URL RESOURCE VIEW (mod/url/view.php)
   ======================================== */

body.path-mod-url .footer-container,
body.path-mod-url .footer-container.container,
body.path-mod-url #page-footer,
body.path-mod-url .page-footer,
body.path-mod-url div.footer-container,
body.path-mod-url footer,
body.path-mod-url #page-footer .container,
body.path-mod-url #page-footer .footer-content {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    overflow: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* ========================================
   TEACHER TOP NAVIGATION STYLES
   ======================================== */

.navbar-nav.teacher-top-nav {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
}

/* Dashboard and My Courses Nav Link Styles */
.dashboard-nav-link,
.mycourses-nav-link,
.ebooks-nav-link,
.training-nav-link,
.support-nav-link {
    color: #475569 !important;
    font-weight: 500 !important;
    padding: 0.5rem 0.75rem !important;
    border-radius: 6px !important;
    transition: all 0.2s ease !important;
    text-decoration: none !important;
}

.dashboard-nav-link:hover,
.mycourses-nav-link:hover,
.ebooks-nav-link:hover,
.training-nav-link:hover,
.support-nav-link:hover {
    background-color: rgba(99, 102, 241, 0.1) !important;
    color: #6366f1 !important;
}

.dashboard-nav-link.active-nav-link,
.mycourses-nav-link.active-nav-link,
.ebooks-nav-link.active-nav-link,
.training-nav-link.active-nav-link,
.support-nav-link.active-nav-link {
    background-color: rgba(99, 102, 241, 0.1) !important;
    color: #6366f1 !important;
    font-weight: 600 !important;
}

.dashboard-nav-link i,
.mycourses-nav-link i,
.ebooks-nav-link i,
.training-nav-link i,
.support-nav-link i {
    font-size: 1rem !important;
    margin-right: 0.35rem !important;
}

.navbar-nav.teacher-top-nav .nav-link {
    color: #475569 !important;
    font-weight: 500 !important;
    padding: 0.5rem 1rem !important;
    border-radius: 8px !important;
    transition: all 0.2s ease !important;
    text-decoration: none !important;
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
}

.navbar-nav.teacher-top-nav .nav-link:hover {
    background-color: rgba(99, 102, 241, 0.1) !important;
    color: #6366f1 !important;
}

.navbar-nav.teacher-top-nav .nav-link.active-nav-link {
    background-color: rgba(99, 102, 241, 0.1) !important;
    color: #6366f1 !important;
    font-weight: 600 !important;
}

.navbar-nav.teacher-top-nav .nav-link i {
    font-size: 14px !important;
}

@media (max-width: 991px) {
    .navbar-nav.teacher-top-nav .nav-link span {
        display: none !important;
    }

    .navbar-nav.teacher-top-nav .nav-link {
        padding: 0.5rem !important;
    }
}

/* ========================================
   TEACHER SIDEBAR FILTERS (view_course.php)
   ======================================== */
.teacher-sidebar .resources-sidebar-header {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding: 16px 20px !important;
    border-bottom: 1px solid #e2e8f0 !important;
    margin-bottom: 16px !important;
}

.teacher-sidebar .resources-sidebar-title {
    font-size: 15px !important;
    font-weight: 600 !important;
    color: #1e293b !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
}

.teacher-sidebar .clear-filters-link {
    font-size: 13px !important;
    color: #6366f1 !important;
    text-decoration: none !important;
    font-weight: 500 !important;
}

.teacher-sidebar .clear-filters-link:hover {
    color: #4f46e5 !important;
    text-decoration: underline !important;
}

.teacher-sidebar .filter-section {
    padding: 0 20px 20px 20px !important;
    margin-bottom: 9px !important;
}

.teacher-sidebar .filter-section-title {
    font-size: 11px !important;
    font-weight: 700 !important;
    color: #64748b !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    margin-bottom: 12px !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    cursor: pointer !important;
}

.teacher-sidebar .filter-section-title i {
    font-size: 10px !important;
    transition: transform 0.2s ease !important;
    color: #64748b !important;
}

.teacher-sidebar .filter-section-title.collapsed i {
    transform: rotate(-90deg) !important;
}

.teacher-sidebar .filter-checkbox-list {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    max-height: 400px !important;
    overflow-y: auto !important;
}

.teacher-sidebar .filter-checkbox-item {
    margin-bottom: 4px !important;
}

.teacher-sidebar .filter-checkbox-label {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    cursor: pointer !important;
    padding: 4px !important;
    border-radius: 6px !important;
    transition: background 0.15s ease !important;
    font-size: 14px !important;
    color: #334155 !important;
    font-weight: 400 !important;
}

.teacher-sidebar .filter-checkbox-label:hover {
    background: #f8fafc !important;
}

.teacher-sidebar .filter-checkbox-label input[type="checkbox"] {
    cursor: pointer !important;
    accent-color: #6366f1 !important;
}

/* Adjust padding inside sidebar content when rendering filters */
.teacher-sidebar.has-filters .sidebar-content {
    padding: 5.5rem 0 2rem 0 !important;
}

/* Grade Filter Pills Styles */
.teacher-sidebar .grade-filter-section {
    margin-bottom: 22px !important;
}

.teacher-sidebar .grade-pills {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 4px !important;
    margin-top: 8px !important;
    padding: 0 !important;
}

.teacher-sidebar .grade-pill {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 44px !important;
    height: 38px !important;
    padding: 0 !important;
    border-radius: 8px !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    font-family: 'DM Mono', monospace !important;
    text-align: center !important;
    cursor: pointer !important;
    border: 1.5px solid #cbd5e1 !important;
    background: transparent !important;
    color: #64748b !important;
    transition: all 0.15s ease !important;
    user-select: none !important;
}

.teacher-sidebar .grade-pill:hover {
    background: #f1f5f9 !important;
    border-color: #94a3b8 !important;
    color: #0f172a !important;
}

.teacher-sidebar .grade-pill.on {
    background: #fef1e9 !important;
    border-color: #ff8403 !important;
    color: #ff8403 !important;
    font-weight: 700 !important;
}

/* Segmented Control / Toggle Button for Resource Tabs */
.tier-cards-container {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    overflow: visible !important;
}

.tier-cards-container.second-level-visible {
    min-height: auto !important;
    padding: 0 !important;
    margin-top: 15px !important;
    margin-bottom: 25px !important;
}

.category-toggle-control {
    display: flex !important;
    background: #f1f5f9 !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 14px !important;
    padding: 6px !important;
    width: 100% !important;
    box-sizing: border-box !important;
    box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.02) !important;
}

.category-toggle-item {
    flex: 1 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
    padding: 14px 10px !important;
    cursor: pointer !important;
    border-radius: 10px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    color: #64748b !important;
    transition: all 0.25s ease !important;
    user-select: none !important;
    background: transparent !important;
    border: none !important;
}

.category-toggle-item i {
    font-size: 18px !important;
    color: #94a3b8 !important;
    transition: color 0.25s ease !important;
}

.category-toggle-count {
    font-size: 12px !important;
    font-weight: 700 !important;
    font-family: 'DM Mono', monospace !important;
    padding: 3px 8px !important;
    border-radius: 20px !important;
    background: rgba(148, 163, 184, 0.1) !important;
    color: #64748b !important;
    transition: all 0.25s ease !important;
}

/* Hover States - mockup specific colors */
.category-toggle-item[data-tab="all"]:hover:not(.active) {
    background: rgb(255 203 4 / 12%) !important;
    color: #c58300 !important;
}

.category-toggle-item[data-tab="all"]:hover:not(.active) i {
    color: #c58300 !important;
}

.category-toggle-item[data-tab="planning"]:hover:not(.active) {
    background: rgb(255 135 2 / 12%) !important;
    color: #ff8702 !important;
}

.category-toggle-item[data-tab="planning"]:hover:not(.active) i {
    color: #ff8702 !important;
}

.category-toggle-item[data-tab="resources"]:hover:not(.active) {
    color: #066d4f !important;
    background: rgba(8, 127, 91, 0.04) !important;
}

.category-toggle-item[data-tab="resources"]:hover:not(.active) i {
    color: #066d4f !important;
}

.category-toggle-item[data-tab="assessments"]:hover:not(.active) {
    color: #28bbe4 !important;
    background: rgb(88 213 240 / 12%) !important;
}

.category-toggle-item[data-tab="assessments"]:hover:not(.active) i {
    color: #28bbe4 !important;
}

/* Active State - white background and subtle border */
.category-toggle-item.active {
    background: #ffffff !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05), 0 1px 3px rgba(0, 0, 0, 0.02) !important;
    border: 1px solid rgba(0, 0, 0, 0.05) !important;
}

/* Active State Mockup-Specific Accent Colors */

/* All Resources (Active) */
.category-toggle-item[data-tab="all"].active {
    color: #c58300 !important;
}

.category-toggle-item[data-tab="all"].active i {
    color: #c58300 !important;
}

.category-toggle-item[data-tab="all"].active .category-toggle-count {
    background: rgb(255 203 4 / 12%) !important;
    color: #c58300 !important;
}

/* Plan (Active) */
.category-toggle-item[data-tab="planning"].active {
    color: #ff8702 !important;
}

.category-toggle-item[data-tab="planning"].active i {
    color: #ff8702 !important;
}

.category-toggle-item[data-tab="planning"].active .category-toggle-count {
    background: rgb(255 135 2 / 12%) !important;
    color: #ff8702 !important;
}

/* Teach (Active) */
.category-toggle-item[data-tab="resources"].active {
    color: #066d4f !important;
}

.category-toggle-item[data-tab="resources"].active i {
    color: #066d4f !important;
}

.category-toggle-item[data-tab="resources"].active .category-toggle-count {
    background: rgba(8, 127, 91, 0.12) !important;
    color: #066d4f !important;
}

/* Assess (Active) */
.category-toggle-item[data-tab="assessments"].active {
    color: #28bbe4 !important;
}

.category-toggle-item[data-tab="assessments"].active i {
    color: #28bbe4 !important;
}

.category-toggle-item[data-tab="assessments"].active .category-toggle-count {
    background: rgb(88 213 240 / 12%) !important;
    color: #28bbe4 !important;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .category-toggle-control {
        flex-direction: column !important;
        border-radius: 16px !important;
        gap: 4px !important;
    }

    .category-toggle-item {
        width: 100% !important;
        padding: 10px !important;
        justify-content: space-between !important;
    }
}.editmode-switch-form

 display: flex !important; visibility: visible !important; opacity: 1 !important; z-index: 9999 !important;