/* ==========================================
   ÁLGEBRA LINEAR (ESPECÍFICO)
========================================== */

/* Design das Matrizes Renderizadas */
.math-matrix {
    border-left: 2px solid var(--accent-color); 
    border-right: 2px solid var(--accent-color); 
    border-radius: 6px;
    padding: 0 5px; 
    border-collapse: separate; 
    border-spacing: 12px 6px; 
    margin: 10px 0; 
    color: var(--text-main);
    font-family: monospace; 
    font-size: 16px; 
    text-align: center; 
    background: rgba(0,0,0,0.2);
}

/* Palco Central de Álgebra */
.board-container { 
    padding: 30px; 
    overflow-y: auto; 
    display: flex; 
    flex-direction: column; 
    gap: 20px; 
}

/* Cards do Histórico de Resoluções */
.history-card { 
    background: var(--panel-bg); 
    border: 1px solid var(--border-color); 
    padding: 15px; 
    border-radius: 8px; 
    box-shadow: 0 4px 6px rgba(0,0,0,0.1); 
}

.history-card h3 { 
    margin: 0 0 10px 0; 
    color: var(--accent-color); 
    font-size: 14px; 
}

/* ==========================================================================
   OTIMIZAÇÃO RESPONSIVA - MOBILE & TABLET (EXCLUSIVO ÁLGEBRA)
========================================================================== */
@media (max-width: 768px), (max-height: 550px) {
    
    /* Ajustes finos nos inputs de criação de matrizes no celular */
    #matNome { 
        height: 38px !important; 
        font-size: 13px !important; 
        padding: 8px 12px !important; 
    }
    
    #matValores { 
        height: 60px !important; 
        min-height: 60px !important; 
        font-size: 13px !important; 
        padding: 8px 12px !important; 
    }
    
    #btnSalvarMatriz { 
        height: 38px !important; 
        font-size: 13px !important; 
        margin-top: 0 !important; 
    }
    
    /* Ajuste da matriz no mobile para caber na tela sem quebrar a rolagem */
    .math-matrix { 
        font-size: 12px !important; 
        border-spacing: 8px 4px !important; 
        margin: 5px 0 !important; 
        padding: 0 4px !important; 
    }
}