/* --- STYLES SPÉCIFIQUES MODULE 11 : Matériaux --- */

/* Ex1: QCM Propriétés (utilise styles QCM globaux via #qcm-mat-1 si appliqué) */
#qcm-mat-1 label { /* Hérite du style QCM global */ }
#qcm-mat-1 input[type="radio"] { /* Hérite du style QCM global */ }


/* Ex2: Associer Matériau/Fonction */
#matching-mat-func-container {
    display: flex;
    gap: 25px;
    flex-wrap: wrap;
}
.material-list { /* Similaire à .comm-list */
    border: 1px dashed #ffc107; /* Jaune pour matériaux */
    padding: 20px;
    min-height: 150px;
    flex-basis: 350px;
    flex-grow: 1;
    background-color: #fff9e6; /* Fond jaune pâle */
    border-radius: 5px;
}
.material-list p:first-child {
    margin-top: 0;
    font-weight: 600;
    text-align: center;
    color: #b38600; /* Jaune foncé */
    margin-bottom: 20px;
}
.component-dropzones { /* Conteneur des zones de dépôt composants */
    display: flex;
    flex-direction: column;
    flex-grow: 2;
    gap: 15px;
}
.dropzone-mat { /* Zone dépôt pour un composant/utilisation */
    border: 2px dashed #ffca2c; /* Jaune moyen */
    padding: 15px;
    min-height: 70px;
    background-color: #fff3cd; /* Fond jaune plus clair */
    border-radius: 5px;
    transition: background-color 0.2s, border-color 0.2s;
    display: flex;
    flex-direction: column;
}
.dropzone-mat p:first-child { /* Texte du composant/utilisation */
    margin-top: 0;
    margin-bottom: 10px;
    font-weight: 500;
    color: #856404; /* Jaune très foncé */
}
.dropzone-mat.over {
    background-color: #ffeeba; /* Jaune plus soutenu */
    border-color: #b38600;
}
.draggable-mat { /* Matériau à glisser */
    background-color: #ffffff;
    padding: 10px 12px;
    border: 1px solid #ffe082; /* Bordure jaune légère */
    margin-bottom: 10px;
    cursor: grab;
    border-radius: 4px;
    box-shadow: 0 1px 2px rgba(0,0,0,0.05);
    font-size: 0.95em;
}
.draggable-mat:active { cursor: grabbing; }
.draggable-mat.dragging { opacity: 0.6; }
/* Styles correction Ex2 Mod11 */
.draggable-mat.correct { border: 2px solid green !important; }
.draggable-mat.incorrect { border: 2px solid darkred !important; }


/* Ex3: QCM Impact Environnemental (utilise styles QCM globaux via #qcm-mat-impact) */
#qcm-mat-impact label { /* Hérite du style QCM global */ }
#qcm-mat-impact input[type="checkbox"] { /* Hérite du style QCM global */ }
/* Styles de correction pour QCM (si on veut surligner le label) */
#qcm-mat-impact label.correct-answer { background-color: #d1e7dd !important; font-weight: bold; }
#qcm-mat-impact label.incorrect-answer { background-color: #f8d7da !important; }


/* --- Responsivité spécifique au Module 11 --- */
@media (max-width: 768px) {
    #matching-mat-func-container { flex-direction: column; }
    .material-list { flex-basis: auto; width: 100%; }
    .component-dropzones { width: 100%; }
    .dropzone-mat { min-height: auto; }
}
@media (max-width: 480px) {
    .draggable-mat { font-size: 0.9em; padding: 8px 10px; }
    .dropzone-mat p:first-child { font-size: 0.9em;}
}