/* Styles extracted from college/6eme/guide-remediation.php */
.guide-body header { background: linear-gradient(135deg, #059669 0%, #10b981 100%); }
.content-section { background: white; border-radius: 12px; padding: 2rem; margin: 2rem 0; box-shadow: 0 4px 6px rgba(0,0,0,0.1); }
.guide-header { text-align: center; margin-bottom: 2rem; padding-bottom: 1rem; border-bottom: 3px solid #059669; }

/* Centrer le titre et sous-titre du header */
.main-content .header {
    text-align: center;
}

.main-content .header h1 {
    text-align: center;
    margin: 0 auto;
}

.main-content .header .subtitle {
    text-align: center;
    margin: 0.5rem auto 0;
}
.guide-content { 
    line-height: 1.8;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-auto-flow: row;
    gap: 1.5rem;
    align-items: start;
}

@media (max-width: 768px) {
    .guide-content {
        grid-template-columns: 1fr;
    }
}

/* Styles pour l'accordéon des matières */
.matiere-card { 
    background: #f8fafc; 
    border-radius: 8px; 
    margin: 0; 
    border-left: 4px solid #059669;
    overflow: hidden;
    transition: all 0.3s ease;
    display: flex;
    flex-direction: column;
    position: relative;
    isolation: isolate;
}

.matiere-card:hover {
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}

.matiere-header {
    width: 100%;
    background: transparent;
    border: none;
    padding: 1.5rem;
    text-align: left;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    transition: background-color 0.3s ease;
    position: relative;
    z-index: 1;
}

.matiere-header:hover {
    background-color: #f1f5f9;
}

.matiere-header h3 {
    color: #059669;
    margin: 0;
    font-size: 1.25rem;
    font-weight: 600;
}

.accordion-icon {
    font-size: 0.875rem;
    color: #059669;
    transition: transform 0.3s ease;
    user-select: none;
}

.matiere-content {
    padding: 0 1.5rem 1.5rem 1.5rem;
    animation: slideDown 0.3s ease;
}

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

.competence-list { margin-left: 1rem; }
.competence-list li { margin-bottom: 0.5rem; padding-left: 1rem; position: relative; }
.competence-list li::before { content: '📚'; position: absolute; left: -1.5rem; top: 0; }
.remediation-tips { background: #ecfdf5; border: 1px solid #10b981; border-radius: 8px; padding: 1rem; margin: 1rem 0; }
.remediation-tips h4 { color: #059669; margin-bottom: 0.5rem; }
.toc ul ul { padding-left: 20px; }