/**
 * Black Dog Kung Fu - Tutor LMS Custom Styles
 * Version: 2.40
 * 
 * Ce fichier override les styles par defaut de Tutor LMS
 * pour correspondre au design system defini dans le CDC Section 5
 * 
 * Changelog v2.40:
 * - FIX: Accents UTF-8 corrects (Précédent, Réussi, Échoué)
 * - Fichier reecrit avec encodage UTF-8 propre via Python
 * 
 * Changelog v2.39:
 * - FIX: Suppression bordures blanches verticales
 */

/* ==========================================================================
   1. RESET DES STYLES TUTOR PAR DÉFAUT
   ========================================================================== */

/* Supprime les styles Tutor qui entrent en conflit */
.tutor-wrap,
.tutor-course-listing-wrap,
.tutor-single-course-main-content,
.tutor-single-lesson-wrap {
    background: transparent !important;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}

/* Force les couleurs du design system */
.tutor-wrap * {
    border-color: var(--border) !important;
}

/* ==========================================================================
   2. CATALOGUE DES COURS (ARCHIVE)
   ========================================================================== */

/* Container principal du catalogue */
.blackdog-courses-archive {
    max-width: 1200px;
    margin: 0 auto;
    padding: 40px 20px;
}

@media (min-width: 768px) {
    .blackdog-courses-archive {
        padding: 60px 40px;
    }
}

/* En-tete du catalogue */
.blackdog-courses-header {
    margin-bottom: 40px;
}

.blackdog-courses-header h1 {
    font-size: 2rem;
    font-weight: 700;
    color: var(--text-primary);
    margin-bottom: 10px;
}

@media (min-width: 768px) {
    .blackdog-courses-header h1 {
        font-size: 2.5rem;
    }
}

.blackdog-courses-header p {
    color: var(--text-secondary);
    font-size: 1rem;
    max-width: 600px;
}

/* Filtres de categories */
.blackdog-courses-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 30px;
}

.blackdog-filter-btn {
    padding: 8px 16px;
    background: var(--bg-elevated);
    border: 1px solid var(--border);
    border-radius: var(--border-radius);
    color: var(--text-secondary);
    font-size: 0.9rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
}

.blackdog-filter-btn:hover,
.blackdog-filter-btn.active {
    background: var(--accent-light);
    border-color: var(--accent);
    color: var(--accent);
}

/* Grille des cours */
.blackdog-courses-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px;
}

@media (min-width: 640px) {
    .blackdog-courses-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 1024px) {
    .blackdog-courses-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

/* ==========================================================================
   3. CARD DE COURS (Composant reutilisable)
   ========================================================================== */

.blackdog-course-card {
    background: var(--bg-card);
    border-radius: var(--border-radius-lg);
    overflow: hidden;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    cursor: pointer;
    text-decoration: none;
    display: block;
}

.blackdog-course-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
}

/* Thumbnail du cours */
.blackdog-course-card__thumb {
    position: relative;
    width: 100%;
    height: 160px;
    background: var(--bg-elevated);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.blackdog-course-card__thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.blackdog-course-card__thumb-placeholder {
    font-size: 3rem;
    opacity: 0.5;
}

/* Badge de statut sur la thumbnail */
.blackdog-course-card__badge {
    position: absolute;
    top: 12px;
    left: 12px;
    padding: 4px 10px;
    border-radius: 4px;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.blackdog-course-card__badge--free {
    background: var(--success-light);
    color: var(--success);
}

.blackdog-course-card__badge--premium {
    background: var(--accent-light);
    color: var(--accent);
}

.blackdog-course-card__badge--new {
    background: var(--info-light);
    color: var(--info);
}

.blackdog-course-card__badge--locked {
    background: var(--bg-elevated);
    color: var(--text-disabled);
}

/* Duree du cours */
.blackdog-course-card__duration {
    position: absolute;
    bottom: 8px;
    right: 8px;
    background: rgba(0, 0, 0, 0.75);
    color: white;
    padding: 3px 8px;
    border-radius: 4px;
    font-size: 0.75rem;
    font-weight: 500;
}

/* Cadenas pour cours verrouilles */
.blackdog-course-card__lock {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 50px;
    height: 50px;
    background: rgba(0, 0, 0, 0.7);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
}

/* Contenu de la card */
.blackdog-course-card__content {
    padding: 20px;
}

.blackdog-course-card__category {
    font-size: 0.75rem;
    color: var(--accent);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 8px;
}

.blackdog-course-card__title {
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--text-primary);
    margin-bottom: 8px;
    line-height: 1.3;
    /* Limite a 2 lignes */
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.blackdog-course-card__desc {
    font-size: 0.9rem;
    color: var(--text-secondary);
    margin-bottom: 15px;
    line-height: 1.5;
    /* Limite a 2 lignes */
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Metadonnees (lecons, duree, niveau) */
.blackdog-course-card__meta {
    display: flex;
    gap: 15px;
    font-size: 0.8rem;
    color: var(--text-secondary);
    margin-bottom: 15px;
}

.blackdog-course-card__meta-item {
    display: flex;
    align-items: center;
    gap: 5px;
}

.blackdog-course-card__meta-item svg {
    width: 14px;
    height: 14px;
    opacity: 0.7;
}

/* Barre de progression */
.blackdog-course-card__progress {
    margin-top: auto;
}

.blackdog-course-card__progress-text {
    display: flex;
    justify-content: space-between;
    font-size: 0.75rem;
    color: var(--text-secondary);
    margin-bottom: 6px;
}

.blackdog-course-card__progress-bar {
    width: 100%;
    height: 6px;
    background: var(--bg-elevated);
    border-radius: 3px;
    overflow: hidden;
}

.blackdog-course-card__progress-fill {
    height: 100%;
    background: var(--accent);
    border-radius: 3px;
    transition: width 0.3s ease;
}

.blackdog-course-card__progress-fill--complete {
    background: var(--success);
}

/* ==========================================================================
   4. PAGE DÉTAIL COURS (SINGLE-COURSE)
   - Overrides specifiques pour contrer les styles Tutor LMS par defaut
   ========================================================================== */

/* Reset des styles Tutor LMS qui peuvent interferer */
.tutor-wrap,
.tutor-single-course-wrap,
.tutor-course-details-page,
body.single-courses .site-main,
body.single-courses #main {
    max-width: none !important;
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
}

.blackdog-single-course {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 30px 20px;
    padding-top: calc(var(--header-height, 75px) + 30px);
    box-sizing: border-box;
}

@media (min-width: 768px) {
    .blackdog-single-course {
        padding: 40px;
        padding-top: calc(var(--header-height, 75px) + 40px);
    }
}

/* Layout 2 colonnes sur desktop */
.blackdog-single-course__layout {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 30px;
    width: 100%;
}

@media (min-width: 1024px) {
    .blackdog-single-course__layout {
        grid-template-columns: 1fr 350px !important;
        gap: 40px;
    }
}

/* Colonne principale */
.blackdog-single-course__main {
    min-width: 0; /* Fix overflow */
    width: 100%;
}

/* Sidebar */
.blackdog-course-sidebar {
    width: 100%;
    position: sticky;
    top: calc(var(--header-height, 75px) + 30px);
    align-self: start;
}

/* En-tete du cours */
.blackdog-single-course__header {
    margin-bottom: 30px;
}

.blackdog-single-course__breadcrumb {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.85rem;
    color: var(--text-secondary);
    margin-bottom: 15px;
}

.blackdog-single-course__breadcrumb a {
    color: var(--text-secondary);
    text-decoration: none;
    transition: color 0.2s;
}

.blackdog-single-course__breadcrumb a:hover {
    color: var(--accent);
}

.blackdog-single-course__breadcrumb svg {
    width: 14px;
    height: 14px;
    opacity: 0.5;
}

.blackdog-single-course__title {
    font-size: 1.75rem;
    font-weight: 700;
    color: var(--text-primary);
    margin-bottom: 15px;
    line-height: 1.2;
}

@media (min-width: 768px) {
    .blackdog-single-course__title {
        font-size: 2.25rem;
    }
}

.blackdog-single-course__excerpt {
    font-size: 1rem;
    color: var(--text-secondary);
    line-height: 1.6;
    margin-bottom: 20px;
}

/* Metadonnees du cours */
.blackdog-single-course__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    padding: 20px;
    background: var(--bg-card);
    border-radius: var(--border-radius-lg);
    margin-bottom: 30px;
}

.blackdog-single-course__meta-item {
    display: flex;
    align-items: center;
    gap: 8px;
}

.blackdog-single-course__meta-icon {
    width: 36px;
    height: 36px;
    background: var(--accent-light);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.blackdog-single-course__meta-icon svg {
    width: 18px;
    height: 18px;
    color: var(--accent);
}

.blackdog-single-course__meta-label {
    font-size: 0.75rem;
    color: var(--text-secondary);
}

.blackdog-single-course__meta-value {
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--text-primary);
}

/* Thumbnail/video d'intro du cours */
.blackdog-single-course__media {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
    background: var(--bg-elevated);
    border-radius: var(--border-radius-lg);
    overflow: hidden;
    margin-bottom: 30px;
}

.blackdog-single-course__media img,
.blackdog-single-course__media video,
.blackdog-single-course__media iframe {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Contenu du cours (description longue) */
.blackdog-single-course__content {
    background: var(--bg-card);
    border-radius: var(--border-radius-lg);
    padding: 25px;
    margin-bottom: 30px;
}

.blackdog-single-course__content h2,
.blackdog-single-course__content h3 {
    color: var(--text-primary);
    margin-top: 25px;
    margin-bottom: 15px;
}

.blackdog-single-course__content h2:first-child,
.blackdog-single-course__content h3:first-child {
    margin-top: 0;
}

.blackdog-single-course__content p {
    color: var(--text-secondary);
    line-height: 1.7;
    margin-bottom: 15px;
}

.blackdog-single-course__content ul,
.blackdog-single-course__content ol {
    color: var(--text-secondary);
    margin-bottom: 15px;
    padding-left: 25px;
}

.blackdog-single-course__content li {
    margin-bottom: 8px;
    line-height: 1.6;
}

/* ==========================================================================
   5. CURRICULUM / SOMMAIRE DU COURS
   ========================================================================== */

.blackdog-curriculum {
    background: var(--bg-card);
    border-radius: var(--border-radius-lg);
    overflow: hidden;
}

.blackdog-curriculum__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px;
    border-bottom: 1px solid var(--border);
}

.blackdog-curriculum__title {
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--text-primary);
}

.blackdog-curriculum__stats {
    font-size: 0.85rem;
    color: var(--text-secondary);
}

/* Topic (groupe de lecons) */
.blackdog-curriculum__topic {
    border-bottom: 1px solid var(--border);
}

.blackdog-curriculum__topic:last-child {
    border-bottom: none;
}

.blackdog-curriculum__topic-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px 20px;
    background: var(--bg-elevated);
    cursor: pointer;
    transition: background 0.2s;
}

.blackdog-curriculum__topic-header:hover {
    background: var(--border);
}

.blackdog-curriculum__topic-title {
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--text-primary);
    display: flex;
    align-items: center;
    gap: 10px;
}

.blackdog-curriculum__topic-icon {
    width: 20px;
    height: 20px;
    transition: transform 0.2s;
}

.blackdog-curriculum__topic.is-open .blackdog-curriculum__topic-icon {
    transform: rotate(180deg);
}

.blackdog-curriculum__topic-meta {
    font-size: 0.8rem;
    color: var(--text-secondary);
}

/* Liste des lecons */
.blackdog-curriculum__lessons {
    display: none;
}

.blackdog-curriculum__topic.is-open .blackdog-curriculum__lessons {
    display: block;
}

/* Item lecon */
.blackdog-curriculum__lesson {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 20px 12px 35px;
    border-top: 1px solid var(--border);
    transition: background 0.2s;
    text-decoration: none;
    color: inherit;
}

/* Forcer la structure du contenu des lecons dans le curriculum */
.blackdog-curriculum__lesson > * {
    flex-shrink: 0;
}

.blackdog-curriculum__lesson > .blackdog-curriculum__lesson-info {
    flex: 1;
    min-width: 0;
    flex-shrink: 1;
}

.blackdog-curriculum__lesson:hover {
    background: var(--bg-elevated);
}

.blackdog-curriculum__lesson--locked {
    opacity: 0.6;
    cursor: not-allowed;
}

.blackdog-curriculum__lesson--locked:hover {
    background: transparent;
}

.blackdog-curriculum__lesson--current {
    background: var(--accent-light);
    border-left: 3px solid var(--accent);
}

.blackdog-curriculum__lesson--completed .blackdog-curriculum__lesson-status {
    background: var(--success);
    color: white;
}

.blackdog-curriculum__lesson-status {
    width: 24px;
    height: 24px;
    min-width: 24px;
    border-radius: 50%;
    background: var(--bg-elevated);
    border: 2px solid var(--border);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.7rem;
}

.blackdog-curriculum__lesson-status svg {
    width: 12px;
    height: 12px;
}

.blackdog-curriculum__lesson-info {
    flex: 1;
    min-width: 0;
}

.blackdog-curriculum__lesson-title {
    font-size: 0.9rem;
    color: var(--text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.blackdog-curriculum__lesson-type {
    font-size: 0.75rem;
    color: var(--text-secondary);
    display: flex;
    align-items: center;
    gap: 5px;
    margin-top: 2px;
}

.blackdog-curriculum__lesson-type svg {
    width: 14px;
    height: 14px;
    flex-shrink: 0;
}

.blackdog-curriculum__lesson-duration {
    font-size: 0.8rem;
    color: var(--text-secondary);
    white-space: nowrap;
}

/* Masquer les elements de previsualisation video de Tutor dans le curriculum */
.blackdog-curriculum .tutor-course-content-list-item-video-preview,
.blackdog-curriculum .tutor-video-preview,
.blackdog-curriculum .tutor-lesson-video-preview,
.blackdog-curriculum .tutor-single-lesson-segment,
.blackdog-curriculum .video-player,
.blackdog-curriculum iframe,
.blackdog-curriculum video,
.blackdog-curriculum .tutor-ratio-container {
    display: none !important;
}

/* S'assurer que les SVG inline dans le curriculum sont petits */
.blackdog-curriculum__lesson svg:not(.blackdog-curriculum__lesson-status svg) {
    width: 14px;
    height: 14px;
}

/* ==========================================================================
   6. PAGE LEÇON (SINGLE-LESSON)
   ========================================================================== */

.blackdog-single-lesson {
    display: flex;
    flex-direction: column;
    min-height: calc(100vh - var(--header-height, 75px));
}

/* Layout lecon : sidebar + contenu */
.blackdog-single-lesson__layout {
    display: grid;
    grid-template-columns: 1fr;
    flex: 1;
}

@media (min-width: 1024px) {
    .blackdog-single-lesson__layout {
        grid-template-columns: 320px 1fr;
    }
}

/* Sidebar lecon (sommaire) */
.blackdog-single-lesson__sidebar {
    display: none;
    background: var(--bg-card);
    border-right: 1px solid var(--border);
    overflow-y: auto;
    max-height: calc(100vh - var(--header-height, 75px));
    position: sticky;
    top: var(--header-height, 75px);
}

@media (min-width: 1024px) {
    .blackdog-single-lesson__sidebar {
        display: block;
    }
}

/* Toggle sidebar mobile */
.blackdog-single-lesson__sidebar-toggle {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 20px;
    background: var(--bg-card);
    border: none;
    border-bottom: 1px solid var(--border);
    color: var(--text-primary);
    font-size: 0.9rem;
    font-weight: 500;
    cursor: pointer;
    width: 100%;
}

@media (min-width: 1024px) {
    .blackdog-single-lesson__sidebar-toggle {
        display: none;
    }
}

.blackdog-single-lesson__sidebar-toggle svg {
    width: 18px;
    height: 18px;
}

/* Sidebar visible en mobile */
.blackdog-single-lesson__sidebar.is-open {
    display: block;
    position: fixed;
    top: var(--header-height, 75px);
    left: 0;
    width: 100%;
    max-width: 350px;
    height: calc(100vh - var(--header-height, 75px));
    z-index: 100;
    box-shadow: 5px 0 20px rgba(0, 0, 0, 0.3);
}

/* Contenu principal de la lecon */
.blackdog-single-lesson__main {
    display: flex;
    flex-direction: column;
}

/* Zone du player video */
.blackdog-single-lesson__player {
    width: 100%;
    background: #000;
}

.blackdog-single-lesson__player-container {
    position: relative;
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    aspect-ratio: 16 / 9;
}

.blackdog-single-lesson__player-container iframe,
.blackdog-single-lesson__player-container video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/* Navigation entre lecons */
.blackdog-single-lesson__nav {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px 20px;
    background: var(--bg-card);
    border-bottom: 1px solid var(--border);
}

.blackdog-single-lesson__nav-btn {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    background: var(--bg-elevated);
    border: 1px solid var(--border);
    border-radius: var(--border-radius);
    color: var(--text-primary);
    font-size: 0.9rem;
    font-weight: 500;
    text-decoration: none;
    transition: all 0.2s;
}

.blackdog-single-lesson__nav-btn:hover {
    background: var(--accent-light);
    border-color: var(--accent);
    color: var(--accent);
}

.blackdog-single-lesson__nav-btn--disabled {
    opacity: 0.5;
    pointer-events: none;
}

.blackdog-single-lesson__nav-btn svg {
    width: 16px;
    height: 16px;
}

.blackdog-single-lesson__nav-title {
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--text-primary);
    text-align: center;
    flex: 1;
    padding: 0 15px;
    /* Limite sur mobile */
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

@media (max-width: 640px) {
    .blackdog-single-lesson__nav-title {
        display: none;
    }
}

/* Contenu texte de la lecon */
.blackdog-single-lesson__content {
    padding: 25px 20px;
    max-width: 900px;
    margin: 0 auto;
    width: 100%;
}

@media (min-width: 768px) {
    .blackdog-single-lesson__content {
        padding: 40px;
    }
}

.blackdog-single-lesson__content h1,
.blackdog-single-lesson__content h2,
.blackdog-single-lesson__content h3 {
    color: var(--text-primary);
    margin-top: 30px;
    margin-bottom: 15px;
    line-height: 1.3;
}

.blackdog-single-lesson__content h1:first-child,
.blackdog-single-lesson__content h2:first-child {
    margin-top: 0;
}

.blackdog-single-lesson__content p {
    color: var(--text-secondary);
    line-height: 1.7;
    margin-bottom: 15px;
}

.blackdog-single-lesson__content img {
    max-width: 100%;
    height: auto;
    border-radius: var(--border-radius);
    margin: 20px 0;
}

.blackdog-single-lesson__content blockquote {
    border-left: 4px solid var(--accent);
    padding-left: 20px;
    margin: 20px 0;
    color: var(--text-secondary);
    font-style: italic;
}

/* Bouton "Marquer comme termine" */
.blackdog-single-lesson__complete {
    padding: 25px 20px;
    border-top: 1px solid var(--border);
    background: var(--bg-card);
}

@media (min-width: 768px) {
    .blackdog-single-lesson__complete {
        padding: 30px 40px;
    }
}

.blackdog-single-lesson__complete-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100%;
    max-width: 400px;
    margin: 0 auto;
    padding: 15px 30px;
    background: var(--accent);
    border: none;
    border-radius: var(--border-radius);
    color: white;
    font-family: 'Inter', sans-serif;
    font-size: 1rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s;
}

.blackdog-single-lesson__complete-btn:hover {
    background: var(--accent-hover);
    transform: translateY(-2px);
    box-shadow: 0 4px 15px rgba(155, 27, 48, 0.3);
}

.blackdog-single-lesson__complete-btn--completed {
    background: var(--success);
    pointer-events: none;
}

.blackdog-single-lesson__complete-btn svg {
    width: 20px;
    height: 20px;
}

/* ==========================================================================
   7. SIDEBAR DU COURS (dans single-course)
   ========================================================================== */

.blackdog-course-sidebar {
    position: sticky;
    top: calc(var(--header-height, 75px) + 20px);
    align-self: start;
}

/* Card CTA d'inscription */
.blackdog-course-sidebar__cta {
    background: var(--bg-card);
    border-radius: var(--border-radius-lg);
    padding: 25px;
    margin-bottom: 20px;
}

.blackdog-course-sidebar__price {
    display: flex;
    align-items: baseline;
    gap: 10px;
    margin-bottom: 15px;
}

.blackdog-course-sidebar__price-current {
    font-size: 1.75rem;
    font-weight: 700;
    color: var(--text-primary);
}

.blackdog-course-sidebar__price-badge {
    padding: 4px 10px;
    background: var(--success-light);
    color: var(--success);
    border-radius: 4px;
    font-size: 0.75rem;
    font-weight: 600;
}

.blackdog-course-sidebar__enroll-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100%;
    padding: 14px 24px;
    background: var(--accent);
    border: none;
    border-radius: var(--border-radius);
    color: white;
    font-family: 'Inter', sans-serif;
    font-size: 1rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s;
    text-decoration: none;
}

.blackdog-course-sidebar__enroll-btn:hover {
    background: var(--accent-hover);
    transform: translateY(-2px);
    box-shadow: 0 4px 15px rgba(155, 27, 48, 0.3);
}

.blackdog-course-sidebar__enroll-btn svg {
    width: 18px;
    height: 18px;
}

/* Progression utilisateur (si inscrit) */
.blackdog-course-sidebar__progress {
    background: var(--bg-card);
    border-radius: var(--border-radius-lg);
    padding: 20px;
    margin-bottom: 20px;
}

.blackdog-course-sidebar__progress-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
}

.blackdog-course-sidebar__progress-title {
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--text-primary);
}

.blackdog-course-sidebar__progress-percent {
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--accent);
}

.blackdog-course-sidebar__progress-bar {
    width: 100%;
    height: 8px;
    background: var(--bg-elevated);
    border-radius: 4px;
    overflow: hidden;
    margin-bottom: 15px;
}

.blackdog-course-sidebar__progress-fill {
    height: 100%;
    background: var(--accent);
    border-radius: 4px;
    transition: width 0.5s ease;
}

.blackdog-course-sidebar__continue-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    padding: 12px 20px;
    background: var(--accent);
    border: none;
    border-radius: var(--border-radius);
    color: white;
    font-size: 0.95rem;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.2s;
}

.blackdog-course-sidebar__continue-btn:hover {
    background: var(--accent-hover);
}

/* Liste des inclus */
.blackdog-course-sidebar__includes {
    background: var(--bg-card);
    border-radius: var(--border-radius-lg);
    padding: 20px;
}

.blackdog-course-sidebar__includes-title {
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--text-primary);
    margin-bottom: 15px;
}

.blackdog-course-sidebar__includes-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.blackdog-course-sidebar__includes-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 0;
    border-bottom: 1px solid var(--border);
    font-size: 0.9rem;
    color: var(--text-secondary);
}

.blackdog-course-sidebar__includes-item:last-child {
    border-bottom: none;
}

.blackdog-course-sidebar__includes-item svg {
    width: 18px;
    height: 18px;
    color: var(--success);
    flex-shrink: 0;
}

/* ==========================================================================
   8. QUIZ ET VALIDATION
   ========================================================================== */

.blackdog-quiz {
    max-width: 800px;
    margin: 0 auto;
    padding: 30px 20px;
}

@media (min-width: 768px) {
    .blackdog-quiz {
        padding: 50px 40px;
    }
}

.blackdog-quiz__header {
    text-align: center;
    margin-bottom: 40px;
}

.blackdog-quiz__title {
    font-size: 1.75rem;
    font-weight: 700;
    color: var(--text-primary);
    margin-bottom: 10px;
}

.blackdog-quiz__desc {
    color: var(--text-secondary);
    font-size: 1rem;
}

/* Question */
.blackdog-quiz__question {
    background: var(--bg-card);
    border-radius: var(--border-radius-lg);
    padding: 25px;
    margin-bottom: 20px;
}

.blackdog-quiz__question-number {
    font-size: 0.8rem;
    color: var(--accent);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 10px;
}

.blackdog-quiz__question-text {
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--text-primary);
    margin-bottom: 20px;
    line-height: 1.4;
}

/* Options de reponse */
.blackdog-quiz__options {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.blackdog-quiz__option {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 15px;
    background: var(--bg-elevated);
    border: 2px solid var(--border);
    border-radius: var(--border-radius);
    cursor: pointer;
    transition: all 0.2s;
}

.blackdog-quiz__option:hover {
    border-color: var(--accent);
}

.blackdog-quiz__option--selected {
    background: var(--accent-light);
    border-color: var(--accent);
}

.blackdog-quiz__option--correct {
    background: var(--success-light);
    border-color: var(--success);
}

.blackdog-quiz__option--incorrect {
    background: var(--error-light);
    border-color: var(--error);
}

.blackdog-quiz__option-radio {
    width: 20px;
    height: 20px;
    min-width: 20px;
    border: 2px solid var(--border);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.blackdog-quiz__option--selected .blackdog-quiz__option-radio {
    border-color: var(--accent);
    background: var(--accent);
}

.blackdog-quiz__option--selected .blackdog-quiz__option-radio::after {
    content: '';
    width: 8px;
    height: 8px;
    background: white;
    border-radius: 50%;
}

.blackdog-quiz__option-text {
    font-size: 0.95rem;
    color: var(--text-primary);
}

/* Bouton soumettre */
.blackdog-quiz__submit {
    display: flex;
    justify-content: center;
    margin-top: 30px;
}

.blackdog-quiz__submit-btn {
    padding: 15px 40px;
    background: var(--accent);
    border: none;
    border-radius: var(--border-radius);
    color: white;
    font-family: 'Inter', sans-serif;
    font-size: 1rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s;
}

.blackdog-quiz__submit-btn:hover {
    background: var(--accent-hover);
    transform: translateY(-2px);
}

.blackdog-quiz__submit-btn:disabled {
    background: var(--text-disabled);
    cursor: not-allowed;
    transform: none;
}

/* Resultat du quiz */
.blackdog-quiz__result {
    text-align: center;
    padding: 40px;
    background: var(--bg-card);
    border-radius: var(--border-radius-lg);
}

.blackdog-quiz__result-icon {
    font-size: 4rem;
    margin-bottom: 20px;
}

.blackdog-quiz__result-title {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--text-primary);
    margin-bottom: 10px;
}

.blackdog-quiz__result-score {
    font-size: 2.5rem;
    font-weight: 700;
    margin-bottom: 20px;
}

.blackdog-quiz__result--passed .blackdog-quiz__result-score {
    color: var(--success);
}

.blackdog-quiz__result--failed .blackdog-quiz__result-score {
    color: var(--error);
}

.blackdog-quiz__result-message {
    color: var(--text-secondary);
    margin-bottom: 30px;
}

/* ==========================================================================
   9. RESPONSIVE MOBILE-FIRST - AJUSTEMENTS FINAUX
   ========================================================================== */

/* Masquer certains elements sur mobile */
@media (max-width: 640px) {
    .blackdog-hide-mobile {
        display: none !important;
    }
}

/* Afficher uniquement sur mobile */
@media (min-width: 641px) {
    .blackdog-show-mobile-only {
        display: none !important;
    }
}

/* Ajustements texte mobile */
@media (max-width: 640px) {
    .blackdog-single-course__title {
        font-size: 1.5rem;
    }
    
    .blackdog-quiz__title {
        font-size: 1.4rem;
    }
    
    .blackdog-quiz__question-text {
        font-size: 1rem;
    }
}

/* Fix pour le scroll sur iOS */
.blackdog-single-lesson__sidebar {
    -webkit-overflow-scrolling: touch;
}

/* ==========================================================================
   10. ÉTATS DE CHARGEMENT ET ANIMATIONS
   ========================================================================== */

/* Skeleton loading */
.blackdog-skeleton {
    background: linear-gradient(
        90deg,
        var(--bg-elevated) 25%,
        var(--border) 50%,
        var(--bg-elevated) 75%
    );
    background-size: 200% 100%;
    animation: blackdog-skeleton-pulse 1.5s ease-in-out infinite;
}

@keyframes blackdog-skeleton-pulse {
    0% {
        background-position: 200% 0;
    }
    100% {
        background-position: -200% 0;
    }
}

/* Fade in animation */
.blackdog-fade-in {
    animation: blackdog-fade-in 0.3s ease-out;
}

@keyframes blackdog-fade-in {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Spinner de chargement */
.blackdog-spinner {
    width: 24px;
    height: 24px;
    border: 3px solid var(--border);
    border-top-color: var(--accent);
    border-radius: 50%;
    animation: blackdog-spin 0.8s linear infinite;
}

@keyframes blackdog-spin {
    to {
        transform: rotate(360deg);
    }
}

/* ==========================================================================
   TUTOR PRO SPOTLIGHT MODE - OVERRIDES GLOBAUX
   Version: 2.18
   Ces styles s'appliquent au template Tutor natif quand le quiz est lance
   ========================================================================== */

/* === FOND GLOBAL === */
body.tutor-spotlight-mode,
.tutor-spotlight-mode,
body[class*="tutor"],
.tutor-single-quiz-wrap,
.tutor-quiz-wrap {
    background: var(--bg-primary, #0d0b09) !important;
}

/* === SIDEBAR (Course Content) - SÉLECTEURS RENFORCÉS === */
.tutor-spotlight-mode .tutor-course-content-list-wrap,
.tutor-spotlight-mode aside,
.tutor-spotlight-mode [class*="sidebar"],
.tutor-course-content-list-wrap,
.tutor-course-sidebar,
/* Tutor Pro specific */
.tutor-spotlight-mode .tutor-course-spotlight-sidebar,
.tutor-course-spotlight-sidebar,
.tutor-spotlight-mode .tutor-spotlight-sidebar,
.tutor-spotlight-sidebar,
div[class*="spotlight"][class*="sidebar"],
div[class*="course-content"],
.tutor-spotlight-mode > aside,
.tutor-spotlight-mode > div > aside {
    background: var(--bg-card, #1a1816) !important;
    border-right: 1px solid var(--border, #3d3a38) !important;
}

/* Forcer tous les divs enfants de la sidebar */
.tutor-spotlight-mode aside *,
.tutor-spotlight-mode [class*="sidebar"] > *,
.tutor-course-content-list-wrap *,
.tutor-spotlight-sidebar * {
    background-color: transparent !important;
}

/* Header sidebar "Course Content" - SÉLECTEURS RENFORCÉS */
.tutor-spotlight-mode .tutor-course-content-list-wrap > div:first-child,
.tutor-course-content-list-wrap > div:first-child,
.tutor-spotlight-mode .tutor-course-content-title,
/* Tutor Pro specific */
.tutor-spotlight-mode h3[class*="content"],
.tutor-spotlight-mode h4[class*="content"],
.tutor-spotlight-mode .tutor-fs-6,
div[class*="Course Content"],
.tutor-spotlight-mode aside > div:first-child {
    background: var(--bg-card, #1a1816) !important;
    color: var(--text-primary, #f5f3f0) !important;
    border-bottom: 1px solid var(--border, #3d3a38) !important;
}

/* Items sidebar */
.tutor-spotlight-mode .tutor-course-content-list-item,
.tutor-spotlight-mode .tutor-accordion-item,
.tutor-course-content-list-item,
.tutor-accordion-item,
/* Tutor Pro specific */
.tutor-spotlight-mode li[class*="content-list"],
.tutor-spotlight-mode div[class*="accordion"],
.tutor-spotlight-mode .tutor-course-topic {
    background: var(--bg-card, #1a1816) !important;
    border-bottom: 1px solid var(--border, #3d3a38) !important;
}

.tutor-spotlight-mode .tutor-course-content-list-item a,
.tutor-spotlight-mode .tutor-course-content-list-item span,
.tutor-course-content-list-item a,
.tutor-course-content-list-item span {
    color: var(--text-secondary, #8a8583) !important;
}

.tutor-spotlight-mode .tutor-course-content-list-item:hover,
.tutor-course-content-list-item:hover {
    background: var(--bg-elevated, #2a2725) !important;
}

/* Item actif */
.tutor-spotlight-mode .tutor-course-content-list-item.is-active,
.tutor-course-content-list-item.is-active,
.is-active[class*="content-list"] {
    background: rgba(155, 27, 48, 0.15) !important;
}

.tutor-spotlight-mode .tutor-course-content-list-item.is-active a,
.tutor-spotlight-mode .tutor-course-content-list-item.is-active span,
.tutor-course-content-list-item.is-active a,
.tutor-course-content-list-item.is-active span {
    color: var(--accent, #9B1B30) !important;
}

/* Accordeon header */
.tutor-spotlight-mode .tutor-accordion-item-header,
.tutor-accordion-item-header {
    background: var(--bg-card, #1a1816) !important;
    color: var(--text-primary, #f5f3f0) !important;
}

/* === HEADER BLEU -> DARK - SÉLECTEURS RENFORCÉS === */
.tutor-spotlight-mode header,
.tutor-spotlight-mode .tutor-header,
header.tutor-bg-primary,
.tutor-bg-primary,
/* Tutor Pro specific - header avec fond bleu */
.tutor-spotlight-mode > header,
.tutor-spotlight-mode header[class*="tutor"],
header[class*="spotlight"],
div[class*="spotlight-header"],
.tutor-spotlight-header,
.tutor-quiz-header,
/* Cibler les elements avec background-color bleu */
[style*="background"][style*="rgb(91, 108, 242)"],
[style*="background-color"][style*="#5b6cf2"],
.tutor-spotlight-mode [class*="header"],
.tutor-spotlight-mode .tutor-d-flex.tutor-align-center {
    background: var(--bg-card, #1a1816) !important;
    background-color: var(--bg-card, #1a1816) !important;
    border-bottom: 1px solid var(--border, #3d3a38) !important;
}

.tutor-spotlight-mode header *,
header.tutor-bg-primary *,
.tutor-spotlight-header *,
.tutor-quiz-header *,
.tutor-spotlight-mode [class*="header"] * {
    color: var(--text-primary, #f5f3f0) !important;
}

/* Progress bar dans le header */
.tutor-spotlight-mode .tutor-progress-bar,
.tutor-progress-bar {
    background: var(--bg-elevated, #2a2725) !important;
}

.tutor-spotlight-mode .tutor-progress-value,
.tutor-progress-value {
    background: var(--accent, #9B1B30) !important;
}

/* Bouton X fermer */
.tutor-spotlight-mode .tutor-iconic-btn,
.tutor-iconic-btn,
.tutor-spotlight-mode button[class*="close"],
.tutor-spotlight-mode [class*="close-btn"] {
    color: var(--text-secondary, #8a8583) !important;
    background: transparent !important;
}

.tutor-spotlight-mode .tutor-iconic-btn:hover,
.tutor-iconic-btn:hover {
    color: var(--text-primary, #f5f3f0) !important;
    background: var(--bg-elevated, #2a2725) !important;
}

/* === ZONE PRINCIPALE === */
.tutor-spotlight-mode main,
.tutor-spotlight-mode .tutor-spotlight-content,
.tutor-spotlight-content {
    background: var(--bg-primary, #0d0b09) !important;
}

/* Card de contenu */
.tutor-spotlight-mode .tutor-card,
.tutor-card {
    background: var(--bg-card, #1a1816) !important;
    border: 1px solid var(--border, #3d3a38) !important;
}

/* === TEXTES === */
.tutor-spotlight-mode h1,
.tutor-spotlight-mode h2,
.tutor-spotlight-mode h3,
.tutor-spotlight-mode h4,
.tutor-spotlight-mode p,
.tutor-spotlight-mode span:not(.tutor-badge):not([class*="badge"]),
.tutor-spotlight-mode label,
.tutor-spotlight-mode div:not([class*="badge"]):not([class*="btn"]) {
    color: var(--text-primary, #f5f3f0) !important;
}

.tutor-spotlight-mode .tutor-color-secondary,
.tutor-spotlight-mode .tutor-color-muted,
.tutor-color-secondary,
.tutor-color-muted {
    color: var(--text-secondary, #8a8583) !important;
}

/* === BOUTONS TUTOR - BORDEAUX === */
.tutor-spotlight-mode .tutor-btn,
.tutor-spotlight-mode .tutor-btn-primary,
.tutor-spotlight-mode button.tutor-btn,
.tutor-btn.tutor-btn-primary,
button.tutor-btn-primary,
.tutor-btn-primary {
    background: var(--accent, #9B1B30) !important;
    background-color: var(--accent, #9B1B30) !important;
    color: white !important;
    border: none !important;
    border-color: var(--accent, #9B1B30) !important;
    padding: 12px 24px !important;
    border-radius: 6px !important;
    font-weight: 600 !important;
    transition: all 0.2s !important;
}

.tutor-spotlight-mode .tutor-btn:hover,
.tutor-spotlight-mode .tutor-btn-primary:hover,
.tutor-btn.tutor-btn-primary:hover,
.tutor-btn-primary:hover {
    background: #7a1526 !important;
    background-color: #7a1526 !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 12px rgba(155, 27, 48, 0.3) !important;
}

/* Boutons outline */
.tutor-spotlight-mode .tutor-btn-outline-primary,
.tutor-btn-outline-primary {
    background: transparent !important;
    border: 1px solid var(--accent, #9B1B30) !important;
    color: var(--accent, #9B1B30) !important;
}

.tutor-spotlight-mode .tutor-btn-outline-primary:hover,
.tutor-btn-outline-primary:hover {
    background: var(--accent, #9B1B30) !important;
    color: white !important;
}

/* Bouton danger (Details rouge) */
.tutor-spotlight-mode .tutor-btn-danger,
.tutor-btn-danger,
.tutor-btn.tutor-btn-danger {
    background: var(--accent, #9B1B30) !important;
    border-color: var(--accent, #9B1B30) !important;
}

/* === OPTIONS DE RÉPONSE === */
.tutor-spotlight-mode .tutor-quiz-answer-item,
.tutor-spotlight-mode .tutor-form-check,
.tutor-quiz-answer-item,
.tutor-form-check {
    background: var(--bg-elevated, #2a2725) !important;
    border: 1px solid var(--border, #3d3a38) !important;
    border-radius: 8px !important;
    padding: 15px 20px !important;
    margin-bottom: 10px !important;
    transition: all 0.2s !important;
}

.tutor-spotlight-mode .tutor-quiz-answer-item:hover,
.tutor-spotlight-mode .tutor-form-check:hover,
.tutor-quiz-answer-item:hover,
.tutor-form-check:hover {
    border-color: var(--accent, #9B1B30) !important;
    background: rgba(155, 27, 48, 0.1) !important;
}

.tutor-spotlight-mode .tutor-form-check-label,
.tutor-form-check-label {
    color: var(--text-primary, #f5f3f0) !important;
}

/* Radio/Checkbox */
.tutor-spotlight-mode input[type="radio"],
.tutor-spotlight-mode input[type="checkbox"] {
    accent-color: var(--accent, #9B1B30) !important;
}

/* === TIMER === */
.tutor-spotlight-mode .tutor-quiz-time,
.tutor-spotlight-mode [class*="time-remaining"],
[class*="time-remaining"] {
    background: var(--bg-elevated, #2a2725) !important;
    color: var(--text-primary, #f5f3f0) !important;
    border: 1px solid var(--border, #3d3a38) !important;
    border-radius: 8px !important;
    padding: 10px 15px !important;
}

/* === TABLEAUX === */
.tutor-spotlight-mode table,
.tutor-spotlight-mode .tutor-table {
    background: var(--bg-card, #1a1816) !important;
    border-collapse: collapse !important;
}

.tutor-spotlight-mode th {
    background: var(--bg-elevated, #2a2725) !important;
    color: var(--text-secondary, #8a8583) !important;
    padding: 12px 15px !important;
    border-bottom: 2px solid var(--border, #3d3a38) !important;
    text-align: left !important;
}

.tutor-spotlight-mode td {
    padding: 15px !important;
    border-bottom: 1px solid var(--border, #3d3a38) !important;
    color: var(--text-primary, #f5f3f0) !important;
}

.tutor-spotlight-mode tr:hover td {
    background: var(--bg-elevated, #2a2725) !important;
}

/* === BADGES === */
.tutor-spotlight-mode .tutor-badge-success,
.tutor-badge-success {
    background: rgba(22, 163, 74, 0.15) !important;
    color: #16A34A !important;
    padding: 4px 12px !important;
    border-radius: 4px !important;
}

.tutor-spotlight-mode .tutor-badge-danger,
.tutor-badge-danger {
    background: rgba(248, 113, 113, 0.15) !important;
    color: #F87171 !important;
    padding: 4px 12px !important;
    border-radius: 4px !important;
}

/* === CHECKMARKS === */
.tutor-spotlight-mode .tutor-icon-mark-circle-solid,
.tutor-icon-mark-circle-solid,
[class*="complete"] svg {
    color: #16A34A !important;
}

/* === CLASSES UTILITAIRES TUTOR === */
.tutor-spotlight-mode .tutor-bg-white,
.tutor-spotlight-mode .tutor-bg-light,
.tutor-bg-white,
.tutor-bg-light {
    background: var(--bg-card, #1a1816) !important;
}

.tutor-spotlight-mode .tutor-color-white,
.tutor-spotlight-mode .tutor-color-black,
.tutor-color-white,
.tutor-color-black {
    color: var(--text-primary, #f5f3f0) !important;
}

/* === SCROLLBAR === */
.tutor-spotlight-mode ::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

.tutor-spotlight-mode ::-webkit-scrollbar-track {
    background: var(--bg-elevated, #2a2725);
}

.tutor-spotlight-mode ::-webkit-scrollbar-thumb {
    background: var(--border, #3d3a38);
    border-radius: 4px;
}

/* === QUIZ QUESTION NUMÉRO === */
.tutor-spotlight-mode .tutor-quiz-question-title,
.tutor-quiz-question-title {
    color: var(--text-primary, #f5f3f0) !important;
    font-size: 1.25rem !important;
    font-weight: 600 !important;
}

/* === RESPONSIVE === */
@media (max-width: 768px) {
    .tutor-spotlight-mode .tutor-quiz-answer-item,
    .tutor-form-check {
        padding: 12px 15px !important;
    }
}

/* ==========================================================================
   TUTOR LMS - BLACK DOG KUNG FU THEME (v2.36)
   CSS complet pour page quiz - Style identique a single-lesson.php
   ========================================================================== */

/* === VARIABLES CSS BLACK DOG === */
:root {
    --bd-bg-primary: #0d0b09;
    --bd-bg-card: #1a1816;
    --bd-bg-elevated: #2a2725;
    --bd-border: #3d3a38;
    --bd-border-light: #5c5856;
    --bd-text-primary: #f5f3f0;
    --bd-text-secondary: #8a8583;
    --bd-text-disabled: #5c5856;
    --bd-accent: #9B1B30;
    --bd-accent-hover: #7a1526;
    --bd-accent-light: rgba(155, 27, 48, 0.1);
    --bd-success: #16A34A;
    --bd-success-light: rgba(22, 163, 74, 0.1);
    --bd-error: #F87171;
    --bd-error-light: rgba(248, 113, 113, 0.1);
    --bd-border-radius: 6px;
    --bd-border-radius-lg: 10px;
    --bd-header-height: 75px;
}

/* ==========================================================================
   1. FOND GÉNÉRAL & RESET
   ========================================================================== */
body.single-tutor_quiz {
    background: var(--bd-bg-primary) !important;
}

body.single-tutor_quiz * {
    box-sizing: border-box;
}

/* ==========================================================================
   2. CACHER LE HEADER BLEU TUTOR (barre de progression)
   ========================================================================== */
body.single-tutor_quiz .tutor-course-topic-single-header,
body.single-tutor_quiz .tutor-single-page-top-bar {
    display: none !important;
}

/* Cacher aussi la barre de progression mobile */
body.single-tutor_quiz .tutor-spotlight-mobile-progress-complete {
    display: none !important;
}

/* ==========================================================================
   3. LAYOUT PRINCIPAL - GRID 2 COLONNES
   FIX v2.37: Reduction sidebar a 280px + gap augmente a 40px
   ========================================================================== */
body.single-tutor_quiz .tutor-course-single-content-wrapper {
    max-width: 1400px !important;
    margin: 0 auto !important;
    padding: calc(var(--bd-header-height) + 30px) 20px 60px !important;
    display: grid !important;
    grid-template-columns: 280px 1fr !important; /* FIX v2.37: 280px au lieu de 300px */
    gap: 40px !important; /* FIX v2.37: Gap augmente pour eviter chevauchement */
    min-height: 100vh !important;
    background: var(--bd-bg-primary) !important;
}

/* ==========================================================================
   4. SIDEBAR GAUCHE
   FIX v2.37: Largeur max forcee a 280px
   FIX v2.38: Design ameliore pour ressembler a la page lecon
   ========================================================================== */
body.single-tutor_quiz .tutor-course-single-sidebar-wrapper,
body.single-tutor_quiz .tutor-quiz-sidebar {
    position: sticky !important;
    top: calc(var(--bd-header-height) + 20px) !important;
    height: fit-content !important;
    max-height: calc(100vh - var(--bd-header-height) - 40px) !important;
    max-width: 280px !important; /* FIX v2.37: Force la largeur max */
    width: 100% !important;
    overflow-y: auto !important;
    background: var(--bd-bg-card) !important;
    border-radius: var(--bd-border-radius-lg) !important;
    flex-shrink: 0 !important; /* FIX v2.37: Empeche le retrecissement */
}

/* --- Header Sidebar avec lien retour --- */
body.single-tutor_quiz .tutor-course-single-sidebar-title {
    padding: 20px !important;
    border-bottom: 1px solid var(--bd-border) !important;
    background: var(--bd-bg-card) !important;
}

/* Lien "Retour au cours" - style comme page lecon */
body.single-tutor_quiz .tutor-course-single-sidebar-title .tutor-fs-6 {
    font-size: 0 !important; /* Cache le texte original */
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
}

body.single-tutor_quiz .tutor-course-single-sidebar-title .tutor-fs-6::before {
    content: "Contenu du cours" !important;
    font-size: 0.8rem !important;
    font-weight: 400 !important;
    color: var(--bd-text-secondary) !important;
}

/* Bouton X fermer sidebar */
body.single-tutor_quiz .tutor-course-single-sidebar-title .tutor-iconic-btn {
    color: var(--bd-text-secondary) !important;
    display: none !important; /* Cacher sur desktop */
}

/* --- Stats du cours (sous le header) --- */
body.single-tutor_quiz .tutor-course-single-sidebar-wrapper::after {
    content: none !important; /* Pas de stats auto-generees */
}

/* --- Topics Accordeon - Style page lecon --- */
body.single-tutor_quiz .tutor-course-topic {
    border-bottom: 1px solid var(--bd-border) !important;
    background: var(--bd-bg-card) !important;
}

body.single-tutor_quiz .tutor-course-topic:last-child {
    border-bottom: none !important;
}

body.single-tutor_quiz .tutor-accordion-item-header {
    padding: 15px 20px !important;
    background: transparent !important;
    cursor: pointer !important;
    transition: background 0.2s !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
}

body.single-tutor_quiz .tutor-accordion-item-header:hover {
    background: var(--bd-bg-elevated) !important;
}

/* Titre du topic avec icone chevron */
body.single-tutor_quiz .tutor-course-topic-title {
    font-size: 0.9rem !important;
    font-weight: 600 !important;
    color: var(--bd-text-primary) !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
}

/* Compteur de lecons */
body.single-tutor_quiz .tutor-course-topic-summary {
    font-size: 0.75rem !important;
    color: var(--bd-text-disabled) !important;
    background: var(--bd-bg-elevated) !important;
    padding: 2px 8px !important;
    border-radius: 10px !important;
}

/* --- Items Lesson/Quiz - Style page lecon --- */
body.single-tutor_quiz .tutor-accordion-item-body {
    padding: 5px 10px 15px !important;
    background: var(--bd-bg-card) !important;
}

body.single-tutor_quiz .tutor-course-topic-item {
    padding: 12px 15px !important;
    border-radius: var(--bd-border-radius) !important;
    margin-bottom: 4px !important;
    transition: all 0.2s !important;
    background: transparent !important;
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    border: none !important; /* FIX v2.39: Supprimer bordures blanches */
    border-left: none !important;
    border-right: none !important;
}

body.single-tutor_quiz .tutor-course-topic-item:hover {
    background: var(--bd-bg-elevated) !important;
}

body.single-tutor_quiz .tutor-course-topic-item a {
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    text-decoration: none !important;
    gap: 12px !important;
}

/* Icone de statut (checkbox) a gauche */
body.single-tutor_quiz .tutor-course-topic-item .tutor-form-check {
    order: -1 !important;
    margin-right: 0 !important;
}

/* Titre de la lecon */
body.single-tutor_quiz .tutor-course-topic-item-title {
    color: var(--bd-text-secondary) !important;
    font-size: 0.85rem !important;
    flex: 1 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

/* Badge de type (VIDEO, QUIZ) a droite */
body.single-tutor_quiz .tutor-course-topic-item-duration {
    font-size: 0.65rem !important;
    font-weight: 600 !important;
    color: var(--bd-text-disabled) !important;
    background: var(--bd-bg-elevated) !important;
    padding: 3px 8px !important;
    border-radius: 4px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
}

body.single-tutor_quiz .tutor-course-topic-item-icon {
    color: var(--bd-text-disabled) !important;
    font-size: 1rem !important;
    display: none !important; /* Cacher l'icone par defaut */
}

/* Item ACTIF (quiz en cours) - highlight rouge sans bordure */
body.single-tutor_quiz .tutor-course-topic-item.is-active {
    background: var(--bd-accent-light) !important;
    border: none !important;
    border-left: none !important;
}

body.single-tutor_quiz .tutor-course-topic-item.is-active .tutor-course-topic-item-title {
    color: var(--bd-accent) !important;
    font-weight: 600 !important;
}

body.single-tutor_quiz .tutor-course-topic-item.is-active .tutor-course-topic-item-duration {
    background: var(--bd-accent) !important;
    color: white !important;
}

/* Checkbox completee - Style checkmark vert */
body.single-tutor_quiz .tutor-form-check-input[type="checkbox"] {
    width: 20px !important;
    height: 20px !important;
    min-width: 20px !important;
    border-radius: 50% !important;
    border: 2px solid var(--bd-border) !important;
    background: transparent !important;
    cursor: default !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

body.single-tutor_quiz .tutor-form-check-input[type="checkbox"]:checked {
    background: var(--bd-success) !important;
    border-color: var(--bd-success) !important;
}

body.single-tutor_quiz .tutor-form-check-input[type="checkbox"]:checked::after {
    content: "\2713" !important;
    color: white !important;
    font-size: 12px !important;
    font-weight: bold !important;
}

/* ==========================================================================
   5. CONTENU PRINCIPAL (DROITE)
   ========================================================================== */
body.single-tutor_quiz #tutor-single-entry-content,
body.single-tutor_quiz .tutor-quiz-single-entry-wrap {
    background: transparent !important;
    padding: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 25px !important;
}

body.single-tutor_quiz .tutor-quiz-wrapper {
    background: transparent !important;
    padding: 0 !important;
}

/* ==========================================================================
   6. BOX INFO QUIZ (Titre + Stats)
   ========================================================================== */
body.single-tutor_quiz .tutor-quiz-wrap {
    background: var(--bd-bg-card) !important;
    border-radius: var(--bd-border-radius-lg) !important;
    padding: 30px !important;
}

/* Label "Quiz" au dessus du titre */
body.single-tutor_quiz .tutor-quiz-wrap > .tutor-fs-7.tutor-color-secondary:first-child {
    font-size: 0.8rem !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    color: var(--bd-text-secondary) !important;
    margin-bottom: 8px !important;
}

/* Titre "Test de quiz" */
body.single-tutor_quiz .tutor-quiz-wrap .header-title {
    font-size: 1.5rem !important;
    font-weight: 600 !important;
    color: var(--bd-text-primary) !important;
    margin: 0 0 25px 0 !important;
    padding-bottom: 20px !important;
    border-bottom: 1px solid var(--bd-border) !important;
}

/* ==========================================================================
   7. STATS GRID (Questions, Time, Marks) - TRADUCTION FR
   FIX v2.39: Suppression bordures verticales
   ========================================================================== */
body.single-tutor_quiz .tutor-quiz-result-summary {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 15px !important;
    margin-bottom: 25px !important;
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
}

body.single-tutor_quiz .tutor-quiz-result-summary > div {
    text-align: center !important;
    padding: 20px 15px !important;
    background: var(--bd-bg-elevated) !important;
    border-radius: var(--bd-border-radius) !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    border: none !important; /* FIX: Supprime bordures blanches */
    border-left: none !important;
    border-right: none !important;
}

/* Cacher le texte anglais et le remplacer */
body.single-tutor_quiz .tutor-quiz-result-summary > div {
    font-size: 0 !important; /* Cache tout le texte */
}

body.single-tutor_quiz .tutor-quiz-result-summary > div::before {
    font-size: 0.7rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    color: var(--bd-text-secondary) !important;
    display: block !important;
}

body.single-tutor_quiz .tutor-quiz-result-summary > div:nth-child(1)::before {
    content: "QUESTIONS" !important;
}

body.single-tutor_quiz .tutor-quiz-result-summary > div:nth-child(2)::before {
    content: "DURÉE" !important;
}

body.single-tutor_quiz .tutor-quiz-result-summary > div:nth-child(3)::before {
    content: "NOTE TOTALE" !important;
}

body.single-tutor_quiz .tutor-quiz-result-summary > div:nth-child(4)::before {
    content: "NOTE REQUISE" !important;
}

/* Valeurs (chiffres) - remettre visible */
body.single-tutor_quiz .tutor-quiz-result-summary .tutor-color-black {
    font-size: 1.5rem !important;
    font-weight: 700 !important;
    color: var(--bd-text-primary) !important;
    display: block !important;
}

/* ==========================================================================
   8. TABLEAU DES TENTATIVES
   FIX v2.39: Suppression bordures verticales blanches
   ========================================================================== */
body.single-tutor_quiz .tutor-table-responsive {
    background: var(--bd-bg-card) !important;
    border-radius: var(--bd-border-radius-lg) !important;
    overflow: hidden !important;
    border: none !important;
    margin-top: 0 !important;
}

body.single-tutor_quiz .tutor-table {
    width: 100% !important;
    border-collapse: collapse !important;
    background: transparent !important;
    border: none !important;
}

/* Supprimer toutes les bordures verticales */
body.single-tutor_quiz .tutor-table th,
body.single-tutor_quiz .tutor-table td {
    border-left: none !important;
    border-right: none !important;
}

/* En-tetes du tableau - TRADUCTION FR */
body.single-tutor_quiz .tutor-table thead {
    background: var(--bd-bg-elevated) !important;
    border: none !important;
}

body.single-tutor_quiz .tutor-table th {
    padding: 15px 12px !important;
    text-align: left !important;
    font-size: 0 !important; /* Cache le texte anglais */
    color: var(--bd-text-secondary) !important;
    font-weight: 600 !important;
    border-bottom: 2px solid var(--bd-border) !important;
    background: transparent !important;
}

/* Traduction des headers via ::after */
body.single-tutor_quiz .tutor-table th::after {
    font-size: 0.7rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    color: var(--bd-text-secondary) !important;
}

body.single-tutor_quiz .tutor-table th:nth-child(1)::after { content: "DATE" !important; }
body.single-tutor_quiz .tutor-table th:nth-child(2)::after { content: "QUESTIONS" !important; }
body.single-tutor_quiz .tutor-table th:nth-child(3)::after { content: "NOTE MAX" !important; }
body.single-tutor_quiz .tutor-table th:nth-child(4)::after { content: "CORRECT" !important; }
body.single-tutor_quiz .tutor-table th:nth-child(5)::after { content: "INCORRECT" !important; }
body.single-tutor_quiz .tutor-table th:nth-child(6)::after { content: "SCORE" !important; }
body.single-tutor_quiz .tutor-table th:nth-child(7)::after { content: "RÉSULTAT" !important; }
body.single-tutor_quiz .tutor-table th:nth-child(8)::after { content: "DÉTAILS" !important; }

/* Cellules du tableau */
body.single-tutor_quiz .tutor-table td {
    padding: 18px 12px !important;
    color: var(--bd-text-primary) !important;
    border-bottom: 1px solid var(--bd-border) !important;
    background: transparent !important;
    font-size: 0.9rem !important;
    vertical-align: middle !important;
}

body.single-tutor_quiz .tutor-table tbody tr:last-child td {
    border-bottom: none !important;
}

body.single-tutor_quiz .tutor-table tbody tr:hover td {
    background: var(--bd-bg-elevated) !important;
}

/* ==========================================================================
   9. BADGES RESULTAT (Pass/Fail) - TRADUCTION FR
   FIX v2.39: Accents via echappement CSS Unicode
   ========================================================================== */
body.single-tutor_quiz .tutor-badge-label {
    font-size: 0 !important; /* Cache Pass/Fail */
    padding: 6px 14px !important;
    border-radius: 20px !important;
    font-weight: 600 !important;
    display: inline-block !important;
}

body.single-tutor_quiz .tutor-badge-label.label-success {
    background: var(--bd-success-light) !important;
    border: 1px solid rgba(22, 163, 74, 0.3) !important;
}

body.single-tutor_quiz .tutor-badge-label.label-success::after {
    content: "Réussi" !important;
    font-size: 0.75rem !important;
    color: var(--bd-success) !important;
}

body.single-tutor_quiz .tutor-badge-label.label-danger {
    background: var(--bd-error-light) !important;
    border: 1px solid rgba(248, 113, 113, 0.3) !important;
}

body.single-tutor_quiz .tutor-badge-label.label-danger::after {
    content: "Échoué" !important;
    font-size: 0.75rem !important;
    color: var(--bd-error) !important;
}

/* ==========================================================================
   10. BOUTONS
   ========================================================================== */

/* Bouton "Details" dans le tableau */
body.single-tutor_quiz .tutor-btn.tutor-btn-tertiary {
    background: var(--bd-bg-elevated) !important;
    color: var(--bd-text-primary) !important;
    border: 1px solid var(--bd-border) !important;
    border-radius: var(--bd-border-radius) !important;
    padding: 8px 16px !important;
    font-size: 0.8rem !important;
    font-weight: 500 !important;
    text-decoration: none !important;
    transition: all 0.2s !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

body.single-tutor_quiz .tutor-btn.tutor-btn-tertiary:hover {
    background: var(--bd-accent) !important;
    border-color: var(--bd-accent) !important;
    color: white !important;
}

/* Bouton "Start Quiz" - PRINCIPAL */
body.single-tutor_quiz .tutor-quiz-btn-grp {
    display: block !important;
    margin-top: 25px !important;
    padding-top: 25px !important;
    border-top: 1px solid var(--bd-border) !important;
}

body.single-tutor_quiz .tutor-btn.tutor-btn-primary,
body.single-tutor_quiz .start-quiz-btn {
    background: var(--bd-accent) !important;
    color: white !important;
    border: none !important;
    border-radius: var(--bd-border-radius) !important;
    padding: 14px 30px !important;
    font-size: 1rem !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: all 0.2s !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
}

/* Traduction "Start Quiz" -> "Commencer le quiz" */
body.single-tutor_quiz .start-quiz-btn {
    font-size: 0 !important;
}

body.single-tutor_quiz .start-quiz-btn::after {
    content: "Commencer le quiz" !important;
    font-size: 1rem !important;
}

body.single-tutor_quiz .tutor-btn.tutor-btn-primary:hover,
body.single-tutor_quiz .start-quiz-btn:hover {
    background: var(--bd-accent-hover) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 15px rgba(155, 27, 48, 0.3) !important;
}

/* ==========================================================================
   11. FOOTER NAVIGATION (Previous/Next)
   ========================================================================== */
body.single-tutor_quiz .tutor-course-topic-single-footer {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding: 20px 0 !important;
    margin-top: 25px !important;
    border-top: 1px solid var(--bd-border) !important;
    background: transparent !important;
}

body.single-tutor_quiz .tutor-course-topic-single-footer .tutor-btn.tutor-btn-secondary {
    background: var(--bd-bg-elevated) !important;
    color: var(--bd-text-primary) !important;
    border: 1px solid var(--bd-border) !important;
    border-radius: var(--bd-border-radius) !important;
    padding: 12px 20px !important;
    font-size: 0.9rem !important;
    font-weight: 500 !important;
    text-decoration: none !important;
    transition: all 0.2s !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
}

body.single-tutor_quiz .tutor-course-topic-single-footer .tutor-btn.tutor-btn-secondary:hover {
    border-color: var(--bd-accent) !important;
    color: var(--bd-accent) !important;
}

/* Traduction Previous/Next - FIX v2.40 */
body.single-tutor_quiz .tutor-course-topic-single-footer .tutor-btn span:not([class*="icon"]) {
    font-size: 0 !important;
}

body.single-tutor_quiz .tutor-single-course-content-prev .tutor-btn span.tutor-ml-8::after {
    content: "Précédent" !important;
    font-size: 0.9rem !important;
}

body.single-tutor_quiz .tutor-single-course-content-next .tutor-btn span.tutor-mr-8::after {
    content: "Suivant" !important;
    font-size: 0.9rem !important;
}

/* Bouton disabled */
body.single-tutor_quiz .tutor-course-topic-single-footer .tutor-btn[disabled] {
    opacity: 0.5 !important;
    cursor: not-allowed !important;
}

/* Icones navigation */
body.single-tutor_quiz .tutor-icon-previous::before,
body.single-tutor_quiz .tutor-icon-next::before {
    color: inherit !important;
}

/* ==========================================================================
   12. MODAL (Confirmation suppression)
   ========================================================================== */
body.single-tutor_quiz .tutor-modal-content,
body.single-tutor_quiz .tutor-modal-content-white {
    background: var(--bd-bg-card) !important;
    border-radius: var(--bd-border-radius-lg) !important;
    color: var(--bd-text-primary) !important;
}

body.single-tutor_quiz .tutor-modal-body {
    padding: 30px !important;
}

body.single-tutor_quiz .tutor-modal .tutor-fs-3 {
    color: var(--bd-text-primary) !important;
}

body.single-tutor_quiz .tutor-modal .tutor-color-muted {
    color: var(--bd-text-secondary) !important;
}

body.single-tutor_quiz .tutor-modal .tutor-btn-outline-primary {
    background: transparent !important;
    border: 1px solid var(--bd-border) !important;
    color: var(--bd-text-primary) !important;
}

body.single-tutor_quiz .tutor-modal .tutor-btn-outline-primary:hover {
    border-color: var(--bd-accent) !important;
    color: var(--bd-accent) !important;
}

body.single-tutor_quiz .tutor-modal-overlay {
    background: rgba(0, 0, 0, 0.7) !important;
}

body.single-tutor_quiz .tutor-modal-close-o {
    color: var(--bd-text-secondary) !important;
}

/* ==========================================================================
   13. RESPONSIVE
   FIX v2.37: Ajout breakpoint tablette intermediaire
   ========================================================================== */

/* Tablette paysage - sidebar reduite */
@media (max-width: 1200px) and (min-width: 1025px) {
    body.single-tutor_quiz .tutor-course-single-content-wrapper {
        grid-template-columns: 250px 1fr !important;
        gap: 30px !important;
    }
    
    body.single-tutor_quiz .tutor-course-single-sidebar-wrapper,
    body.single-tutor_quiz .tutor-quiz-sidebar {
        max-width: 250px !important;
    }
}

/* Tablette portrait et mobile - sidebar masquee */
@media (max-width: 1024px) {
    body.single-tutor_quiz .tutor-course-single-content-wrapper {
        grid-template-columns: 1fr !important;
        padding-top: calc(var(--bd-header-height) + 20px) !important;
    }
    
    body.single-tutor_quiz .tutor-course-single-sidebar-wrapper,
    body.single-tutor_quiz .tutor-quiz-sidebar {
        display: none !important;
    }
    
    body.single-tutor_quiz .tutor-quiz-result-summary {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

@media (max-width: 600px) {
    body.single-tutor_quiz .tutor-quiz-result-summary {
        grid-template-columns: 1fr !important;
    }
    
    body.single-tutor_quiz .tutor-quiz-wrap {
        padding: 20px !important;
    }
    
    body.single-tutor_quiz .tutor-table-responsive {
        overflow-x: auto !important;
    }
    
    body.single-tutor_quiz .tutor-table {
        min-width: 700px !important;
    }
    
    body.single-tutor_quiz .tutor-course-topic-single-footer {
        flex-direction: column !important;
        gap: 15px !important;
    }
    
    body.single-tutor_quiz .tutor-course-topic-single-footer .tutor-btn {
        width: 100% !important;
        justify-content: center !important;
    }
}

/* ==========================================================================
   14. LIGHT MODE
   ========================================================================== */
body.light-mode.single-tutor_quiz {
    --bd-bg-primary: #f5f3f0;
    --bd-bg-card: #ffffff;
    --bd-bg-elevated: #e8e4e1;
    --bd-border: #d4d0cd;
    --bd-border-light: #b8b3b0;
    --bd-text-primary: #1a1816;
    --bd-text-secondary: #5c5856;
    --bd-text-disabled: #8a8583;
}

body.light-mode.single-tutor_quiz {
    background: var(--bd-bg-primary) !important;
}

body.light-mode.single-tutor_quiz .tutor-course-single-content-wrapper {
    background: var(--bd-bg-primary) !important;
}

body.light-mode.single-tutor_quiz .tutor-course-single-sidebar-wrapper,
body.light-mode.single-tutor_quiz .tutor-quiz-sidebar,
body.light-mode.single-tutor_quiz .tutor-quiz-wrap,
body.light-mode.single-tutor_quiz .tutor-table-responsive,
body.light-mode.single-tutor_quiz .tutor-modal-content {
    background: var(--bd-bg-card) !important;
}

body.light-mode.single-tutor_quiz .tutor-course-topic,
body.light-mode.single-tutor_quiz .tutor-accordion-item-body {
    background: var(--bd-bg-card) !important;
}

body.light-mode.single-tutor_quiz .tutor-quiz-result-summary > div,
body.light-mode.single-tutor_quiz .tutor-table thead,
body.light-mode.single-tutor_quiz .tutor-accordion-item-header:hover,
body.light-mode.single-tutor_quiz .tutor-course-topic-item:hover,
body.light-mode.single-tutor_quiz .tutor-table tbody tr:hover td {
    background: var(--bd-bg-elevated) !important;
}

body.light-mode.single-tutor_quiz .tutor-course-topic-title,
body.light-mode.single-tutor_quiz .tutor-quiz-wrap .header-title,
body.light-mode.single-tutor_quiz .tutor-quiz-result-summary .tutor-color-black,
body.light-mode.single-tutor_quiz .tutor-table td {
    color: var(--bd-text-primary) !important;
}

body.light-mode.single-tutor_quiz .tutor-course-single-sidebar-title .tutor-fs-6::before,
body.light-mode.single-tutor_quiz .tutor-course-topic-summary,
body.light-mode.single-tutor_quiz .tutor-quiz-result-summary > div::before,
body.light-mode.single-tutor_quiz .tutor-table th::after {
    color: var(--bd-text-secondary) !important;
}

body.light-mode.single-tutor_quiz .tutor-course-topic,
body.light-mode.single-tutor_quiz .tutor-course-single-sidebar-title,
body.light-mode.single-tutor_quiz .tutor-table th,
body.light-mode.single-tutor_quiz .tutor-table td,
body.light-mode.single-tutor_quiz .tutor-quiz-wrap .header-title,
body.light-mode.single-tutor_quiz .tutor-quiz-btn-grp,
body.light-mode.single-tutor_quiz .tutor-course-topic-single-footer {
    border-color: var(--bd-border) !important;
}

body.light-mode.single-tutor_quiz .tutor-btn.tutor-btn-tertiary,
body.light-mode.single-tutor_quiz .tutor-course-topic-single-footer .tutor-btn.tutor-btn-secondary {
    background: var(--bd-bg-elevated) !important;
    color: var(--bd-text-primary) !important;
    border-color: var(--bd-border) !important;
}

/* ==========================================================================
   15. FIX ADDITIONNELS
   ========================================================================== */

/* Forcer le fond du main */
body.single-tutor_quiz #main.site-main {
    background: var(--bd-bg-primary) !important;
}

/* Cacher les elements Tutor non necessaires */
body.single-tutor_quiz .tutor-d-none {
    display: none !important;
}

/* Icones Tutor - couleur coherente */
body.single-tutor_quiz [class*="tutor-icon-"] {
    color: inherit !important;
}

/* Fix pour les marges Tutor */
body.single-tutor_quiz .tutor-mt-32 {
    margin-top: 0 !important;
}

body.single-tutor_quiz .tutor-mb-32 {
    margin-bottom: 0 !important;
}

body.single-tutor_quiz .tutor-mt-12 {
    margin-top: 0 !important;
}

/* ==================== QUIZ BUTTONS FIX ==================== */

/* Correction du bouton Submit & Next avec texte doublé */
.tutor-quiz-wrapper button[type="submit"],
.tutor-quiz-wrapper .tutor-btn,
.tutor-quiz-btn,
.tutor-btn-primary {
    /* Reset pour éviter les textes superposés */
    font-size: 0 !important;
    line-height: 1;
}

/* Afficher uniquement le texte voulu */
.tutor-quiz-wrapper button[type="submit"]::after,
.tutor-quiz-btn-submit::after {
    content: 'Suivant';
    font-size: 0.95rem !important;
    font-weight: 600;
}

/* Alternative : cacher le texte anglais si présent */
.tutor-quiz-wrapper .tutor-btn span.tutor-btn-text-english {
    display: none;
}

/* ==================== STYLE GÉNÉRAL DES BOUTONS QUIZ ==================== */

/* Bouton principal (Submit/Next) */
.tutor-quiz-wrapper .tutor-btn-primary,
.tutor-quiz-wrapper button[type="submit"],
.tutor-quiz-wrapper .tutor-quiz-submit-btn {
    background: var(--accent, #9B1B30) !important;
    color: white !important;
    border: none !important;
    padding: 12px 24px !important;
    border-radius: 6px !important;
    cursor: pointer;
    transition: all 0.2s ease;
    font-family: 'Inter', sans-serif;
    font-size: 0.95rem !important;
    font-weight: 600 !important;
}

.tutor-quiz-wrapper .tutor-btn-primary:hover,
.tutor-quiz-wrapper button[type="submit"]:hover {
    background: var(--accent-hover, #7a1526) !important;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(155, 27, 48, 0.3);
}

/* Bouton secondaire (Back/Previous) */
.tutor-quiz-wrapper .tutor-btn-secondary,
.tutor-quiz-wrapper .tutor-quiz-back-btn,
.tutor-quiz-wrapper a.tutor-btn[href*="back"] {
    background: transparent !important;
    color: var(--text-primary, #f5f3f0) !important;
    border: 1px solid var(--border, #3d3a38) !important;
    padding: 12px 24px !important;
    border-radius: 6px !important;
    font-size: 0.95rem !important;
    font-weight: 500 !important;
    transition: all 0.2s ease;
}

.tutor-quiz-wrapper .tutor-btn-secondary:hover,
.tutor-quiz-wrapper .tutor-quiz-back-btn:hover {
    border-color: var(--accent, #9B1B30) !important;
    color: var(--accent, #9B1B30) !important;
}

/* Bouton tertiaire (Skip Question) */
.tutor-quiz-wrapper .tutor-quiz-skip-btn,
.tutor-quiz-wrapper a[class*="skip"] {
    background: none !important;
    border: none !important;
    color: var(--text-secondary, #8a8583) !important;
    font-size: 0.9rem !important;
    font-weight: 500;
    cursor: pointer;
    transition: color 0.2s;
    padding: 12px 16px !important;
}

.tutor-quiz-wrapper .tutor-quiz-skip-btn:hover {
    color: var(--accent, #9B1B30) !important;
}

/* ==================== QUIZ HEADER INFO ==================== */

.tutor-quiz-header,
.tutor-quiz-question-wrap > div:first-child {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
    padding-bottom: 20px;
    border-bottom: 1px solid var(--border, #3d3a38);
}

.tutor-quiz-question-count,
.tutor-quiz-attempted-count {
    color: var(--text-secondary, #8a8583);
    font-size: 0.9rem;
}

.tutor-quiz-question-count strong,
.tutor-quiz-attempted-count strong {
    color: var(--text-primary, #f5f3f0);
}

/* Timer */
.tutor-quiz-time-remaining,
.tutor-quiz-countdown {
    background: var(--bg-card, #1a1816);
    border: 1px solid var(--border, #3d3a38);
    border-radius: 6px;
    padding: 8px 16px;
    font-size: 0.9rem;
}

.tutor-quiz-countdown .tutor-countdown-value {
    color: var(--accent, #9B1B30);
    font-weight: 700;
    font-size: 1rem;
}

/* ==================== OPTIONS TRUE/FALSE ==================== */

.tutor-quiz-answer-item,
.tutor-quiz-option {
    background: var(--bg-card, #1a1816);
    border: 1px solid var(--border, #3d3a38);
    border-radius: 8px;
    padding: 16px 20px;
    margin-bottom: 12px;
    cursor: pointer;
    transition: all 0.2s;
    display: flex;
    align-items: center;
    gap: 12px;
}

.tutor-quiz-answer-item:hover,
.tutor-quiz-option:hover {
    border-color: var(--accent, #9B1B30);
    background: var(--bg-elevated, #2a2725);
}

.tutor-quiz-answer-item.selected,
.tutor-quiz-option.selected,
.tutor-quiz-answer-item input:checked + label,
.tutor-quiz-option input:checked + span {
    border-color: var(--accent, #9B1B30);
    background: rgba(155, 27, 48, 0.1);
}

/* Radio/Checkbox custom */
.tutor-quiz-answer-item input[type="radio"],
.tutor-quiz-answer-item input[type="checkbox"] {
    width: 20px;
    height: 20px;
    accent-color: var(--accent, #9B1B30);
}

/* ==================== QUESTION DISPLAY ==================== */

.tutor-quiz-question-title,
.tutor-quiz-question h3,
.tutor-quiz-question h4 {
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--text-primary, #f5f3f0);
    margin-bottom: 24px;
    line-height: 1.4;
}

/* Numéro de question */
.tutor-quiz-question-number {
    color: var(--accent, #9B1B30);
    font-weight: 700;
    margin-right: 8px;
}

/* ==================== NAVIGATION BUTTONS CONTAINER ==================== */

.tutor-quiz-buttons,
.tutor-quiz-btn-wrapper,
.tutor-quiz-question-wrap > div:last-child {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-top: 30px;
    padding-top: 20px;
    border-top: 1px solid var(--border, #3d3a38);
}

/* ==================== RESPONSIVE ==================== */

@media (max-width: 768px) {
    .tutor-quiz-buttons,
    .tutor-quiz-btn-wrapper {
        flex-direction: column;
        gap: 10px;
    }
    
    .tutor-quiz-buttons button,
    .tutor-quiz-buttons a {
        width: 100%;
        text-align: center;
    }
    
    .tutor-quiz-answer-item {
        padding: 14px 16px;
    }
}

/* ==========================================================================
   MASQUER LA CATÉGORIE DANS LE BREADCRUMB
   Retire le lien Xingyi Quan / Bagua Zhang du fil d'Ariane
   Version: 1.0 - 04/01/2026
   ========================================================================== */

/* Masquer le lien vers course-category */
.blackdog-single-course__breadcrumb a[href*="course-category"] {
    display: none !important;
}

/* Masquer le séparateur SVG qui précède ce lien (le 3ème svg) */
.blackdog-single-course__breadcrumb a[href*="course-category"] + svg,
.blackdog-single-course__breadcrumb a[href*="/courses/"] + svg + a[href*="course-category"] {
    display: none !important;
}

/* Alternative plus robuste : masquer le SVG avant le lien category */
.blackdog-single-course__breadcrumb > a[href*="/courses/"] + svg:has(+ a[href*="course-category"]) {
    display: none !important;
}

/* Fallback si :has() non supporté - masquer le 3ème enfant (svg après Cours) */
.blackdog-single-course__breadcrumb > *:nth-child(5) {
    display: none !important;
}

/* Et le 6ème enfant (le lien category lui-même) */
.blackdog-single-course__breadcrumb > *:nth-child(6) {
    display: none !important;
}