/**
 * Num'Education - Styles Espace Professeur
 */

/* Auth */
.numedu-auth-container { max-width: 450px; margin: 40px auto; padding: 20px; }
.numedu-auth-card { background: var(--numedu-bg-white); border-radius: var(--numedu-radius-lg); box-shadow: var(--numedu-shadow-lg); overflow: hidden; }
.numedu-auth-tabs { display: flex; border-bottom: 1px solid var(--numedu-border); }
.numedu-tab { flex: 1; padding: 16px; text-align: center; text-decoration: none; color: var(--numedu-text-light); font-weight: 500; transition: all 0.2s; }
.numedu-tab:hover { color: var(--numedu-text); background: var(--numedu-bg); }
.numedu-tab.active { color: var(--numedu-primary); border-bottom: 2px solid var(--numedu-primary); margin-bottom: -1px; }
.numedu-auth-card form { padding: 24px; }
.numedu-auth-card h2 { margin: 0 0 24px 0; text-align: center; }

/* Dashboard */
.numedu-dashboard { max-width: 1000px; margin: 0 auto; padding: 20px; }
.numedu-dashboard-header { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 32px; flex-wrap: wrap; gap: 16px; }
.numedu-welcome h1 { margin: 0 0 4px 0; font-size: 1.75rem; }
.numedu-welcome p { margin: 0; color: var(--numedu-text-light); }
.numedu-header-actions { display: flex; gap: 12px; }

/* Stats */
.numedu-stats-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 16px; margin-bottom: 32px; }
.numedu-stats-4 { grid-template-columns: repeat(4, 1fr); }
.numedu-stat-card { background: var(--numedu-bg-white); border-radius: var(--numedu-radius-lg); padding: 20px; text-align: center; box-shadow: var(--numedu-shadow); }
.numedu-stat-value { display: block; font-size: 2rem; font-weight: 700; color: var(--numedu-primary); }
.numedu-stat-label { font-size: 13px; color: var(--numedu-text-muted); }

/* Section */
.numedu-section { margin-bottom: 32px; }
.numedu-section-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; }
.numedu-section-header h2 { margin: 0; }

/* Quiz List */
.numedu-quiz-list { display: flex; flex-direction: column; gap: 12px; }
.numedu-quiz-card { background: var(--numedu-bg-white); border-radius: var(--numedu-radius-lg); padding: 20px; box-shadow: var(--numedu-shadow); display: flex; justify-content: space-between; align-items: center; gap: 20px; flex-wrap: wrap; }
.numedu-quiz-info { flex: 1; min-width: 200px; }
.numedu-quiz-title { margin: 0 0 8px 0; font-size: 1.125rem; }
.numedu-quiz-meta { display: flex; gap: 16px; flex-wrap: wrap; font-size: 13px; color: var(--numedu-text-muted); align-items: center; }
.numedu-quiz-code { margin-top: 8px; font-size: 13px; color: var(--numedu-text-light); }
.numedu-quiz-code strong { font-family: monospace; font-size: 14px; letter-spacing: 1px; }
.numedu-quiz-actions { display: flex; gap: 8px; align-items: center; }

/* Editor */
.numedu-quiz-editor { max-width: 900px; margin: 0 auto; padding: 20px; }
.numedu-editor-header { margin-bottom: 24px; }
.numedu-editor-header h1 { margin: 0; }
.numedu-editor-actions { background: var(--numedu-bg-white); border-radius: var(--numedu-radius-lg); padding: 20px; box-shadow: var(--numedu-shadow); display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 16px; position: sticky; bottom: 20px; margin-top: 20px; }
.numedu-info-box { background: var(--numedu-info-light); color: #1e40af; padding: 12px 16px; border-radius: var(--numedu-radius); display: flex; align-items: center; gap: 12px; }

/* Questions */
.numedu-question-count { color: var(--numedu-text-muted); font-weight: normal; }
#numedu-questions-container { margin-bottom: 20px; }
.numedu-question-item { background: var(--numedu-bg); border-radius: var(--numedu-radius); margin-bottom: 16px; overflow: hidden; }
.numedu-question-header { display: flex; justify-content: space-between; align-items: center; padding: 12px 16px; background: var(--numedu-border); }
.numedu-question-number { font-weight: 600; font-size: 14px; }
.numedu-question-actions { display: flex; gap: 4px; }
.numedu-question-body { padding: 16px; }
.numedu-add-question-wrapper { text-align: center; padding: 20px; }

/* Options Editor */
.numedu-options-list { display: flex; flex-direction: column; gap: 8px; margin-bottom: 12px; }
.numedu-option-row { display: flex; align-items: center; gap: 8px; }
.numedu-option-row input[type="radio"],
.numedu-option-row input[type="checkbox"] { flex-shrink: 0; }
.numedu-option-row .numedu-input { flex: 1; }
.numedu-remove-option { color: var(--numedu-danger); }
.numedu-truefalse-options { display: flex; gap: 24px; }
.numedu-radio-label { display: flex; align-items: center; gap: 8px; cursor: pointer; padding: 8px 0; }

/* Results View */
.numedu-results-view { max-width: 1000px; margin: 0 auto; padding: 20px; }
.numedu-results-header { margin-bottom: 24px; }
.numedu-results-header h1 { margin: 0 0 8px 0; }
.numedu-results-actions { display: flex; gap: 12px; margin-bottom: 24px; }
.numedu-subtitle { color: var(--numedu-text-muted); margin: 0 0 20px 0; }

/* Question Analysis */
.numedu-question-analysis { display: flex; flex-direction: column; gap: 12px; }
.numedu-analysis-item { display: flex; align-items: center; gap: 16px; }
.numedu-analysis-question { flex: 1; min-width: 200px; font-size: 14px; }
.numedu-analysis-bar { width: 200px; height: 12px; background: var(--numedu-bg); border-radius: 100px; overflow: hidden; }
.numedu-analysis-fill { height: 100%; border-radius: 100px; }
.numedu-analysis-rate { width: 100px; font-size: 14px; font-weight: 500; text-align: right; }

/* Profile */
.numedu-profile-view { max-width: 600px; margin: 0 auto; padding: 20px; }
.numedu-profile-header { margin-bottom: 24px; }
.numedu-profile-header h1 { margin: 0; }
.numedu-info-table { width: 100%; }
.numedu-info-table th { text-align: left; font-weight: 500; padding: 12px 0; color: var(--numedu-text-light); width: 40%; }
.numedu-info-table td { padding: 12px 0; }

/* Dropdown menu fix */
.numedu-dropdown {
    position: relative;
}

.numedu-dropdown-menu {
    position: absolute;
    top: 100%;
    right: 0;
    min-width: 160px;
    background: rgba(30, 30, 50, 0.95);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 8px;
    padding: 8px 0;
    z-index: 1000;
    display: none;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.3);
}

.numedu-dropdown.open .numedu-dropdown-menu,
.numedu-dropdown-menu.show {
    display: block;
}

.numedu-dropdown-item {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    padding: 10px 16px;
    border: none;
    background: none;
    color: #fff;
    font-size: 14px;
    text-align: left;
    cursor: pointer;
    transition: background 0.2s;
}

.numedu-dropdown-item:hover {
    background: rgba(255, 255, 255, 0.1);
}

.numedu-dropdown-danger {
    color: #f44336;
}

.numedu-dropdown-danger:hover {
    background: rgba(244, 67, 54, 0.2);
}

/* S'assurer que les cartes quiz ne coupent pas le dropdown */
.numedu-quiz-item {
    overflow: visible;
}

.numedu-quiz-list {
    overflow: visible;
}
/* Fix dropdown z-index */
.numedu-quiz-item {
    position: relative;
    z-index: 1;
}

.numedu-quiz-item:hover,
.numedu-quiz-item:focus-within {
    z-index: 100;
}

.numedu-dropdown-menu {
    z-index: 9999 !important;
}

/* ================================
   FIX CONTRASTE - Textes sur fond sombre
   ================================ */

/* Titres sur fond glassmorphism */
.numedu-page-bg h1,
.numedu-page-bg h2,
.numedu-page-bg h3,
.numedu-header h1 {
    color: #fff;
}

/* Labels et textes de formulaire sur fond sombre */
.numedu-page-bg label,
.numedu-page-bg .form-group label,
.setup-card h3,
.setup-card label {
    color: #fff;
}

/* Texte d'aide sous les champs */
.numedu-page-bg .form-help,
.numedu-page-bg .numedu-hint {
    color: rgba(255, 255, 255, 0.7);
}

/* Input placeholder */
.numedu-page-bg input::placeholder {
    color: rgba(255, 255, 255, 0.5);
}

/* Texte dans les cartes sur fond sombre */
.numedu-page-bg .numedu-card h2,
.numedu-page-bg .numedu-card h3 {
    color: #fff;
}


/* Responsive */
@media (max-width: 768px) {
    .numedu-dashboard-header { flex-direction: column; }
    .numedu-quiz-card { flex-direction: column; align-items: stretch; }
    .numedu-quiz-actions { justify-content: flex-start; }
    .numedu-stats-4 { grid-template-columns: repeat(2, 1fr); }
    .numedu-editor-actions { flex-direction: column; }
    .numedu-analysis-item { flex-direction: column; align-items: stretch; }
    .numedu-analysis-bar { width: 100%; }
    .numedu-analysis-rate { text-align: left; }
}

/* ========================================
   Image Upload pour les questions
   ======================================== */
.numedu-image-upload {
    margin: 15px 0;
    padding: 15px;
    background: rgba(255,255,255,0.05);
    border-radius: 8px;
    border: 1px dashed rgba(255,255,255,0.2);
}

.numedu-image-preview {
    position: relative;
    display: inline-block;
    margin-bottom: 10px;
}

.numedu-image-preview img {
    max-width: 300px;
    max-height: 200px;
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.3);
}

.numedu-image-preview .numedu-remove-image {
    position: absolute;
    top: -8px;
    right: -8px;
    background: #e74c3c;
    color: white;
    border: none;
    border-radius: 50%;
    width: 24px;
    height: 24px;
    cursor: pointer;
    font-size: 14px;
    line-height: 1;
}

.numedu-image-preview .numedu-remove-image:hover {
    background: #c0392b;
}

.numedu-upload-image {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
    border: none;
    padding: 8px 16px;
    border-radius: 6px;
    cursor: pointer;
    font-size: 14px;
    transition: all 0.3s ease;
}

.numedu-upload-image:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
}