/*
 Theme Name:   Umayya Astra Child
 Theme URI:    https://umayya-elearning.duckdns.org
 Description:  Astra Pro child theme for Umayya E-Learning Platform — Arabic RTL, multilingual, LearnDash integration
 Author:       Umayya
 Author URI:   https://umayya-elearning.duckdns.org
 Template:     astra
 Version:      1.0.3
 Text Domain:  umayya-astra-child
 License:      GPL-2.0-or-later
 License URI:  https://www.gnu.org/licenses/gpl-2.0.html
*/

/* ==========================================================================
   Base overrides for Umayya platform
   ========================================================================== */

/* LearnDash course grid spacing */
.learndash-wrapper .ld-course-list-items .ld-item-list-item {
    margin-bottom: 1.5rem;
}

/* Course catalog card styling */
.umayya-course-card {
    border-radius: 16px;
    overflow: hidden;
    transition: box-shadow 0.2s ease;
}

.umayya-course-card:hover {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

/* ==========================================================================
   LearnDash lesson layout — mobile & responsive (T058)
   ========================================================================== */

/* Responsive video: 16:9 aspect ratio, prevents overflow on small screens */
.learndash-wrapper .ld-focus-content video,
.learndash-wrapper .ld-focus-content iframe,
.learndash-wrapper .ld-lesson-topic-content video,
.learndash-wrapper .ld-lesson-topic-content iframe,
.alakademia-player-shell .ld-focus-content video,
.alakademia-player-shell .ld-focus-content iframe {
    max-width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
    display: block;
}

/* Video wrapper — ensures iframe fills width correctly */
.learndash-wrapper .ld-focus-content .bunny-video-wrapper,
.learndash-wrapper .ld-focus-content .video-embed-wrapper,
.learndash-wrapper .ld-lesson-topic-content .bunny-video-wrapper {
    position: relative;
    width: 100%;
    padding-top: 56.25%; /* 16:9 */
    overflow: hidden;
    border-radius: 8px;
    background: #000;
}

.learndash-wrapper .ld-focus-content .bunny-video-wrapper iframe,
.learndash-wrapper .ld-focus-content .video-embed-wrapper iframe,
.learndash-wrapper .ld-lesson-topic-content .bunny-video-wrapper iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    aspect-ratio: unset;
}

/* Touch-friendly nav: WCAG 2.5.5 minimum 44×44px tap targets */
.learndash-wrapper .ld-nav-item,
.learndash-wrapper .ld-nav-previous,
.learndash-wrapper .ld-nav-next {
    min-height: 44px;
    display: flex;
    align-items: center;
}

.learndash-wrapper .ld-nav-item a,
.learndash-wrapper .ld-nav-previous a,
.learndash-wrapper .ld-nav-next a {
    min-height: 44px;
    display: flex;
    align-items: center;
    padding: 8px 12px;
}

/* Touch-friendly lesson list items */
.learndash-wrapper .ld-item-list-item .ld-item-name {
    min-height: 44px;
    display: flex;
    align-items: center;
    padding: 10px 12px;
}

/* Touch-friendly expand/collapse button */
.learndash-wrapper .ld-expand-button {
    min-width: 44px;
    min-height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Mark Complete — full width on mobile for easy tapping */
@media (max-width: 767px) {
    .learndash-wrapper .learndash_mark_complete_button,
    .learndash-wrapper #learndash_mark_complete_button,
    .alakademia-player-shell .learndash_mark_complete_button,
    .alakademia-player-shell #learndash_mark_complete_button {
        width: 100%;
        text-align: center;
        padding: 14px 20px;
        font-size: 16px;
    }

    /* Lesson navigation prev/next — stack vertically and fill width on mobile */
    .learndash-wrapper .ld-lesson-navigation,
    .learndash-wrapper .ld-navigation {
        flex-direction: column;
        gap: 8px;
    }

    .learndash-wrapper .ld-nav-previous,
    .learndash-wrapper .ld-nav-next {
        width: 100%;
    }

    .learndash-wrapper .ld-nav-previous a,
    .learndash-wrapper .ld-nav-next a {
        width: 100%;
        justify-content: center;
        padding: 14px 20px;
        font-size: 16px;
    }

    /* Focus mode sidebar — collapsed by default on mobile */
    .learndash-wrapper .ld-focus .ld-focus-sidebar {
        transform: translateX(-100%);
        position: fixed;
        z-index: 200;
        top: 0;
        left: 0;
        height: 100vh;
        width: 280px;
        transition: transform 0.3s ease;
        overflow-y: auto;
    }

    .learndash-wrapper .ld-focus .ld-focus-sidebar.is-open {
        transform: translateX(0);
    }

    /* Course navigation toggle — ensure it's always visible on mobile */
    .learndash-wrapper .ld-course-navigation-toggle {
        display: flex !important;
        min-width: 44px;
        min-height: 44px;
        align-items: center;
        justify-content: center;
    }

    /* Quiz buttons — full width on mobile */
    .learndash-wrapper .wpProQuiz_button,
    .learndash-wrapper .wpProQuiz_button2,
    .learndash-wrapper input[name="startQuiz"],
    .learndash-wrapper input[name="finish"] {
        width: 100%;
        padding: 14px 20px;
        font-size: 16px;
        text-align: center;
    }

    /* Quiz answers — larger touch targets */
    .learndash-wrapper .wpProQuiz_questionList label {
        min-height: 44px;
        display: flex;
        align-items: center;
        padding: 10px 12px;
        cursor: pointer;
    }

    .learndash-wrapper .wpProQuiz_questionList input[type="radio"],
    .learndash-wrapper .wpProQuiz_questionList input[type="checkbox"] {
        width: 20px;
        height: 20px;
        flex-shrink: 0;
        margin-inline-end: 10px;
    }

    /* Focus header — tighter on mobile */
    .learndash-wrapper .ld-focus .ld-focus-header {
        padding: 8px 12px;
    }

    /* Content padding on mobile */
    .learndash-wrapper .ld-focus .ld-focus-main .ld-focus-content {
        padding: 16px;
    }
}

/* Student dashboard progress bars */
.umayya-progress-bar {
    height: 8px;
    border-radius: 4px;
    background-color: #e5e7eb;
}

.umayya-progress-bar-fill {
    height: 100%;
    border-radius: 4px;
    background-color: var(--color-primary);
    transition: width 0.3s ease;
}

/* Star ratings */
.umayya-star-rating .star-filled {
    color: #f59e0b;
}

.umayya-star-rating .star-empty {
    color: #d1d5db;
}